火狐表格css生成tbody查杀表格宽度答案

【问题标题】：Firefox table css generate tbody killing table width火狐表格css生成tbody查杀表格宽度
【发布时间】：2011-03-07 23:21:15
【问题描述】：

我正在开发一个仅限 IE 的网站并使其跨浏览器。 IE、Chrome 和 Safari 中的一切看起来都不错。然而 Firefox 并不高兴。

我有一个名为“datatable”的表类，顾名思义就是一个数据表。我试图让它伸展到它所包含的 div 宽度的 100%。上面的 div 是 100%。当我使用萤火虫检查它时，表格伸展到 100%。但是，Firefox 生成的 tbody 并没有拉伸到 100%。因此，表中的行与 tbody 一样小。所以我不知道如何解决这个问题。我试过了 tbody{width:100%;} 它什么也没做。

任何想法我都将不胜感激。

【问题讨论】：

你能不能也写一点html和css？

标签： html css firefox width css-tables

【解决方案1】：

如果某些浏览器需要display:block in <table> 那么...

table {
    // Something..
    display: block;
}
body:not(:-moz-handler-blocked) table {
    display: table;
}

示例：电子邮件中的 HTML

如果您仍需要在 Firefox 上预览，请稍作修改

【讨论】：

【解决方案2】：

检查您是否将font-size 设置为小于100% 的值。

【讨论】：

【解决方案3】：

我有同样的问题，最终通过设置标题单元格的宽度属性解决了它（我认为这就是 firefox 用来决定 tbody 宽度的方法）。

table.table_class th { 宽度：115px; }

如果您像我一样不想弄乱通用 css，这是一个选择。

【讨论】：

【解决方案4】：

好的，我刚刚回答了我的问题...在 css 中有一个像这样的通用 css...

table
{
    border:0px solid #000000;
    padding:0 0 0 0;
    border-collapse:collapse;
    border-spacing:0;
    display:block;
}

我删除了 display:block，现在一切正常...我曾在 table.datatable 定义中寻找过，但确实想在文件中寻找通用的...

【讨论】：

【解决方案5】：

这可能很愚蠢，但请确保您正确选择了 tbody

#datatable tbody{width:100%}

【讨论】：