确保遵守表格单元格宽度

时间:2012-02-02 14:02:25

标签: html css html-table tablelayout word-wrap

我有一个带有多个cols的HTML <table>。在任何情况下,如何确保给定的单元格/ col宽度?也就是说,如果我给单元格宽度为100px并且文本内容很长(超过100个字符而没有任何空格),则文本内容应该遵循100px宽度并换行到下一行..

我已尝试使用word-wrap:break-word,但这不起作用。

请帮帮我。

1 个答案:

答案 0 :(得分:14)

使用table-layout: fixed确保您的td宽度得到尊重。

查看MDN docs以获取更多信息。

修改

这样的事情对你有用:

table {
    table-layout: fixed;
}
td {
    color:white;
    width:50px;
    background-color:Blue;
    word-wrap: break-word;
    max-width:50px;
}

这是a working fiddle来演示。