ElementUI修改tabs便签页样式

有的时候我们希望标签页在页面中居中显示，例如这样：

居中显示
element官网默认是这样的
默认显示
修改方法：在el-tabs标签中设置stretch属性，例如下面这样：

<el-tabs v-model="activeName"
           stretch
           @tab-click="handleClick">
    <el-tab-pane label="用户管理"
                 name="first">
      <div style="width:100%;height:100%;border:1px red solid">用户管理</div>
    </el-tab-pane>
    <el-tab-pane label="配置管理"
                 name="second">
      <div style="width:100%;height:100%;border:1px red solid">配置管理</div>
    </el-tab-pane>
    <el-tab-pane label="角色管理"
                 name="third">
      <div style="width:100%;height:100%;border:1px red solid">角色管理</div>
    </el-tab-pane>
    <el-tab-pane label="定时任务补偿"
                 name="fourth">
      <div style="width:100%;height:100%;border:1px red solid">定时任务补偿</div>
    </el-tab-pane>
  </el-tabs>

但是我现在不希望他占据一整行，只占据页面的50%，然后居中显示，例如这样：

50%居中
修改方法为重写el-tabs__header样式即可：

.el-tabs__header {
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}