CSS自动换行会导致div空格后出现空白字符

我使用CSS自动换行属性（设置为break-word）在固定宽度和可变高度的div元素中显示单个没有间隔的字符串。 div元素本身在表格单元<td>内。单词中断按预期工作，按定义的固定宽度打破单词。但是，在IE9（IE7文档标准）中，div后面似乎有一些额外的空间，导致表格单元的宽度扩展（不需要）。 div宽度本身似乎是正确的，正如CSS所指定的那样。我使用div和表单元格周围的边界来验证。我试过显式设置表格单元格宽度（和最大宽度），但都不行。在Firefox或Chrome中未观察到此行为。CSS自动换行会导致div空格后出现空白字符

编辑：添加样品代码here。该问题只发生在IE（Browser_Mode = IE9; Document_Mode = IE7）。

来源

2012-05-25 kaspnord

显然td正在为这个词的整个长度腾出空间，好像它没有破碎。您可以通过在div上设置overflow: hidden来防止此问题。

的jsfiddle：http://jsfiddle.net/gmDpe/6/

来源

2012-05-25 22:14:16 Brilliand

谢谢，这解决了问题！ – kaspnord

我碰到类似的问题就来了一次。您是否尝试过在桌面元素上使用table-layout : fixed？

table-layout是一个很少有人知道，但widely supported财产，可以在这种情况下相当有用。

来源

2012-05-25 23:59:31 Denis

感谢您的输入。但是，表格布局属性无法解决问题。 – kaspnord

真的吗？我在你提交的例子中使用了'table-layout：fixed'，它看起来应该在IE7中。 – Denis

是的，这个属性确实解决了我提供的例子。我的生产表实际上没有明确定义的宽度，这可能是为什么表格布局不起作用。谢谢。 – kaspnord

CSS自动换行会导致div空格后出现空白字符

回答

相关问题