强制<table>列为固定宽度;防止自动扩展

Question

我通常通过CSS设置固定的列宽，效果完美:

#tableID thead tr th:nth-child(1){width: 75px;} 
#tableID thead tr th:nth-child(2){width: 75px;}
/* etc… */

但现在我在一种情况下，我不会知道所需的列宽度，直到运行时。下面是我用来动态设置列宽度的代码摘录:

var tr=$("<tr>");
var colArr=Home.ColDefs[this.statBatchType].colArr;
for(var i=0;i<colArr.length;i++){
    var col=colArr[i];
    tr.append(
        $("<th>")
            .html(col.title)
            .css("width",col.width)
    );
}
this.jqTHead.append(tr);

对不起，这段代码有点脱离上下文，但底线是我添加列，由<th>元素表示，到表头和设置每一个的宽度。

然而，实际情况是，Firefox将列宽度视为最小值，然后在用户展开浏览器窗口时自动扩展列宽度。考虑这样一个例子，我的JavaScript代码将每列的宽度设置为75px。Firefox将确保每列宽度至少为75px，但如果用户最大化(或放大)他的浏览器，只要有足够的空间，每个列将自动加宽。

这对我来说很奇怪，因为JavaScript代码似乎与我在CSS中所做的功能相当。然而，CSS方法不会导致这种奇怪的行为。

任何想法吗?

Answer 1

修正<table>的宽度，这将确保表格不会占用可用的大小和碰撞布局

Answer 2

table-layout: fixed;在表上就是这样做的:列永远不会扩展到适合它们的内容，如果你给表本身一个宽度，额外的空间是平均分配的。单元格的内容根本不起作用