element ui table 组件 设置表头前几个字段固定后导致的 表格错位问题的解决

 平台使用的表格组件是vue element-ui的table组件，因为列表展示字段较多，内容较长，所以设置了几个搜索项固定在表格前几列，操作项固定在最后，中间其它项可拖动，结果导致了表格的拖动项与非拖动项之间的错位问题，如图：

 

 前端样式方面还不太熟，找的公司同事帮忙调整，添加了样式，解决了问题，特此记录：

table标签：

<el-table ref="listTable"
                :data="dataList"
                @selection-change="dataListSelectionChangeHandle"
                @sort-change="dataListSortChangeHandle"
                stripe
                highlight-current-row
                border
                style="width: 100%"
                class="afterjustify"
                v-loading="dataListLoading">

样式：

<style lang="css">
/*修改子页面样式*/
.afterjustify .el-table__fixed-body-wrapper {
  top: 48px !important;
}
</style>

效果：