在下表中,如何使用CSS在td
单元格中对齐数据,以便我们不会获得水平滚动条?
还要求表格的高度应自动调整..
<table>
<tr><th>name</th>
<th>info</th></tr>
<tr><td>Harry</td>
<td>suminfosuminfosuminfosuminfosum infosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfos uminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfo<td></tr>
<tr><td>test</td><td>test data</td></tr>
</table>
答案 0 :(得分:0)
为了支持所有浏览器,请选择
.workbreak {
word-wrap: break-word; /* IE 5.5-7 */
white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
white-space: pre-wrap; /* current browsers */
}
<table>
<tr><th>name</th>
<th>info</th></tr>
<tr><td>Harry</td>
<td class="workbreak">suminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfosuminfo<td></tr>
<tr><td>test</td><td>test data</td></tr>
</table>
答案 1 :(得分:0)
超长单元格需要word-wrap:break-word
。
答案 2 :(得分:0)
尝试:
table {
table-layout: fixed;
word-wrap: break-word;
width: 600px; /* or whatever you like */
}