el-table自适应宽度

  • Post author:
  • Post category:其他

在页面宽度减少时,el-table会出现overflow滑条,想要解决这个问题,在对每列宽度使用min-width替代width的情况下

  1. 对el-table进行绝对定位,即父元素设置position:relative,el-table设置position:absolute;width:100%;

  1. 动态计算el-table宽度,使用如下css语句

.el-table {

width: 100%;

}

.el-table__header-wrapper table,

.el-table__body-wrapper table {

width: 100% !important;

}

.el-table__body,

.el-table__footer,

.el-table__header {

table-layout: auto;

}

推荐使用第二种方法!


版权声明:本文为m0_53525025原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。