我有一个表格单元格,它一直阻止包裹它的内容(跨度)。以下是根据Chrome开发工具提供的方案:
<td>
具有以下规则:
overflow:visible;
white-space:normal;
<table>
有:
table-layout:fixed;
表中的第一行有两列定义了固定宽度;有问题的单元格有padding="2"
。
据我所知应该这样做,但它并不包含内容。我尝试过以下规则未成功:
word-break: break-all;
word-wrap: break-word;
max-width: 120px; /*this is the max width I want to ensure*/
我在这里缺少什么?
答案 0 :(得分:1)
我不知道您的代码到底是怎么回事,因为您没有发布它,但我按照您的说明操作,它对我有用。
请在此处查看:http://jsfiddle.net/FJ7dB/
HTML:
<table>
<tr>
<td>TD-1-1</td>
<td padding="2">
<span>TD-1-2 ContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContent</span>
</td>
</tr>
<tr>
<td>TD-2-1</td>
<td>TD-2-2</td>
</tr>
</table>
CSS:
table{
table-layout:fixed;
border:1px solid blue;
}
td{
width:120px;
max-width:120px;
word-break: break-all;
word-wrap: break-word;
border:1px solid red;
}
使它起作用的是max-width
,你说它不成功。
没有必要设置
overflow:visible;
white-space:normal;
因为visible
和normal
是他们的默认值。