记一次 elementui的Table表格有横向滚动条时fixed的列不对齐的问题

问题

"element-ui"版本"2.15.9"
中间查了一些方法都没搞定，最后采用固定单元格的高度搞定了

解决办法

// 给header单元格设置高度
:deep(.el-table__header-wrapper) {
  .cell {
    height: 23px !important;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
// 给右侧浮动的列的header单元格设置高度
:deep(.el-table__fixed-header-wrapper) {
  .cell {
    height: 23px !important;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
// 给所有的单元格设置高度
:deep(.cell) {
  height: 50px !important;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
}

记录一下网上看到的其他方法

1、

this.$refs.diytable.doLayout()

2、

.el-table__body-wrapper::-webkit-scrollbar {
    width: 30px; 
    height: 30px; 
}

.el-table__body-wrapper::-webkit-scrollbar-thumb {
    background-color: #dddee0;
    border-radius: 8px;
}
 
上面.el-table__body-wrapper::-webkit-scrollbar 是 30px 下面这个也要 30px
*/
.el-scrollbar__wrap::-webkit-scrollbar{
   width: 30px; 
   height: 30px;
}

参考

element-ui Table 表格自定义滚动条样式踩坑及解决方案（设置fixed时表格对不齐）
el-table自定义滚动条大小后出现错位