MDL数据表不会一直收缩

时间:2018-04-11 16:52:09

标签: html css html-table material-design-lite


我试图找到一种允许MDL数据表缩小以适应移动设备的好方法。我尝试将表格宽度设置为100%。

只要我还将表格布局设置为固定(我不知道为什么),这是有效的:

table {
  width: 100%;
  table-layout: fixed;
}

但是,当尝试在可选择的表上使用此方法时,整个表将被推向右侧:

enter image description here

如果没有将可选择的类添加到表中,它看起来像这样:

enter image description here

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

我最终解决了这个问题(感谢@ sweaver2112的评论),通过改变表格上的填充使其变小。

  td, th {
    padding: 12px 5px;
  }

  td:first-of-type, th:first-of-type {
    padding-left: 15px;
  }

  td:last-of-type, th:last-of-type {
    padding-right: 15px;
  }