我正在根据自己的需要构建网格组件，可排列的列，行等。现有的组件不符合我的需要或太重。我刚刚开始使用可调整大小的列，但出乎意料的是 WebKit 在我无法解释的异常情况下出现了问题。虽然 table-layout：fixed; 在所有其他浏览器（甚至是IE）上运行良好，但Safari / Chrome让我很头疼。
以下是我到目前为止写的内容：TSort Embriyo
正如你所看到的，它创建了两个表 - 一个用于标题，一个用于body，一些包装在它们周围。然后它尝试使用 table-layout：fixed ，因为它更适合动态网格概念。对于 table-layout：fixed ，除了我的所有单元格（td / th）都有溢出：隐藏，之外，表格的宽度至关重要。空白：nowrap 和文本溢出：省略号以更好地模仿网格外观。
现在“bug” - 两个表的构造方式相同，单元格和表格的宽度由同一函数计算和设置。 “bug”是无法解释的，因为我使用的方法与顶层表一样工作但底层表失败。基本上它就好像我没有分配宽度。但是你可以在Web Inspector中看到它肯定有宽度......所以......嗯？
我尝试了一切，我交换了功能，我删除了顶级表，我尝试按照构建顶级表的方式构建底层表。但它一直都在失败。但是，当我将生成的表代码直接复制/粘贴到页面中时，它开始工作。所以我的猜测是它具有表格的动态特性。但是为什么它在顶级表上工作呢？
通过创建具有预先指定宽度的表格元素，我能够摆脱这个“错误”。但它没有解释这种奇怪的行为，是吗？
答案 0 :(得分：2)
我找到了解决方法 - 仍然不确定究竟发生了什么。
移动：
self._addColElements(self.bd);
到construct函数的底部（当然会将其从populate中移除）。
您可能已经注意到，在我的previous test中，我添加了一个'数据'选项。我发现从populate调用_init并使用该数据工作正常 - 除非我使用setTimeout来延迟调用 - 就像ajax get一样 - 然后它会使表失真。所以它的时间相关 - 也许WebKit正在做一些有趣的事情来优化渲染。
修改
好的，我有一个理论;）
当创建表并在同一函数中添加所有行时，在函数调用结束时应用css - 此时table-layout:fixed项仅在表具有宽度时才适用。
如果表是创建的，并且css应用于它（即因为控件已经通过例如ajax或setTimeout返回到浏览器），当它没有宽度时，则固定布局具有没有效果。随后添加项甚至设置宽度不会导致重新评估css。