Firefox错误地显示表格单元格(chrome工作正常)

时间:2013-06-23 07:36:15

标签: css google-chrome firefox css-tables

我正在设计包含几个div的网站布局。整个网站都在容器中。徽标下的所有内容都是构造的,然后我有内容包装在内容包装器中。 Content-wrapper有2个子项:sidebar-wrapper和main-wrapper。我想在main-wrapper中设计一些东西,但它在firefox中没有正确显示。 main和sidebar都设置为显示表格单元格,但是如果我在主包装器的右侧添加带有文本的img,那么主包装器宽度会发生变化,而且比父div(内容包装器)宽一点。它发生在firefox和IE(chrome工作得很好)。以下是使用firefox和chrome启用的开发工具拍摄的一些图像。

铬: enter image description here

火狐: enter image description here

那么有没有办法让表格单元格填充父宽度或以某种方式解决这个问题?

2 个答案:

答案 0 :(得分:6)

您是否在包装器div(指定table-layout:fixed;的那个)上尝试了display: table;

我有一个类似的问题,这个属性强制表是一个固定的宽度而不是由其内容决定。默认情况下,表格列设置为行中最宽单元格(具有可破坏内容)的宽度,在您的情况下为图像,因此第二列太大:)

有关table-layout的更多信息,请访问here

答案 1 :(得分:0)

将以下行放在表类

table-layout: fixed;