TD中的CSS换行符

Question

如果我有一个很长的字符串(没有空格!).我可以强制浏览器对它进行换行,例如,td通过CSS 在表中.宽度似乎没有任何影响.

注意:我知道有人提交没有空格的长字符串是不太可能的,但你永远不会知道......

我试过了:

.gridrow td
{
    padding: 1em;
    text-align: center;
    word-wrap: break-word; 
}

我使用FF作为我的浏览器.word-wrap似乎只在CSS3中使用？

Answer 1

我想你的意思是在CSS中:

#id
{
  max-width: 100px; /*or whatever*/
  word-wrap: break-word;
}

使用Firebug在您的网站上测试,它的工作原理.

参考文章.

Answer 2

表是一种特殊情况。如果可以的话，他们会继续扩展，以免掩盖任何内容；你也不能使用overflow: hidden它们。以下是一些选项：

1. 使用可选的中断字符。（来源：http://www.quirksmode.org/oddsandends/wbr.html­ ）如果您可以控制以编程方式将字符<wbr>插入长字符串中，这可能是一个解决方案。

2. 也许更好的是，根据您的情况，您可以限制表格使用严格的宽度，此时它应该遵守您的规则：

   table {
       table-layout: fixed;
       width: 100%;
   }
   
   table td {
       word-wrap: break-word;         /* All browsers since IE 5.5+ */
       overflow-wrap: break-word;     /* Renamed property in CSS3 draft spec */
   }