我在容器中有一个基本表。 该表将包含约25列。 我正在尝试在表格溢出时添加水平滚动条,现在过得很艰难。
现在正在发生的情况是,表格单元格通过自动调整单元格的高度并保持固定的表格宽度来容纳单元格的内容。
对于我的方法为何无法解决此问题的建议,我深表感谢。
提前谢谢了!
的CSS
.search-table-outter {margin-bottom:30px; }
.search-table{table-layout: fixed; margin:40px auto 0px auto; overflow-x:scroll; }
.search-table, td, th{border-collapse:collapse; border:1px solid #777;}
th{padding:20px 7px; font-size:15px; color:#444; background:#66C2E0;}
td{padding:5px 10px; height:35px;}
tr:nth-child(even) {background: #f5f5f5;}
tr:nth-child(odd) {background: #FFF;}
的HTML
Col1 | col2 | col3 | col4 | col5 | col5 |
---|
JS小提琴(注意:如果可能,我希望水平滚动条位于带有红色边框的容器中):[http://jsfiddle.net/ZXnqM/3/]