我正在开发一个报告应用程序,该应用程序生成HTML表格,这些表格可以是多行高,多列长(有时是40或更多)。
问题是,这些表中的许多表在它们包含的div之外延伸,它看起来很丑陋。由于某种原因,包含div不会拉伸到表的大小。
所以,这是我的问题:是否可以使用CSS将包含元素拉伸到表的宽度?
这是jfiddle,问题处于最基本的水平。
答案 0 :(得分:3)
答案 1 :(得分:1)
只需添加<div style="overfow:auto"><table>
并快乐编码
div{
border:2px solid #F00;
padding:10px;
}
table{
border:2px solid #00F;
}
td, th{
border:1px solid #00F;
padding:4px;
}
&#13;
<div style="overflow: auto">
<table>
<tr>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
<th>Lorem</th>
<th>Ipsum</th>
<th>Dolor</th>
<th>Sit</th>
<th>Amet</th>
</tr>
<tr>
<td>Lorem</td>
<td>Ipsum</td>
<td>Dolor</td>
<td>Sit</td>
<td>Amet</td>
<td>Lorem</td>
<td>Ipsum</td>
<td>Dolor</td>
<td>Sit</td>
<td>Amet</td>
<td>Lorem</td>
<td>Ipsum</td>
<td>Dolor</td>
<td>Sit</td>
<td>Amet</td>
<td>Lorem</td>
<td>Ipsum</td>
<td>Dolor</td>
<td>Sit</td>
<td>Amet</td>
<td>Lorem</td>
<td>Ipsum</td>
<td>Dolor</td>
<td>Sit</td>
<td>Amet</td>
<td>Lorem</td>
<td>Ipsum</td>
<td>Dolor</td>
<td>Sit</td>
<td>Amet</td>
<td>Lorem</td>
<td>Ipsum</td>
<td>Dolor</td>
<td>Sit</td>
<td>Amet</td>
</tr>
</table>
</div>
&#13;
答案 2 :(得分:0)