CSS使用问题

1. 给 <button> 添加 float 后，按钮不能点击
   float后，元素会与其他元素重叠，可使用z-index属性将元素放在最上层。
   z-inded越大则显示在越上面，且position属性为非static时z-inded才能生效。

<el-button style="float: right;position: relative;z-index: 1;">点击</el-button>

2. 多个子元素在父元素中垂直居中

<div style="height: 100px;width: 500px;display: table-cell;vertical-align: middle;text-align: center;">
    <div>1</div>
    <div>2</div>
    <div>3</div>
</div>

<div style="height: 100px;position: relative;">
    <div style="position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);">
        <div>1</div>
        <div>2</div>
        <div>3</div>
    </div>
</div>

第一种方式必须设置width，而第二种方式不需要。