html - 相似的表格在 Opera 和 IE7 中看起来不同

Question

我正在尝试实现基本的固定表头效果。为此，我使用了两个具有完全相同标记和 CSS 的表格。 “内容”表位于设置了 overflow-y 的 div 中。一切看起来都很好，除了 IE7 和 Opera，其中“标题”表的列宽与“内容”表的列宽不同。

这是一个 jsfiddle:http://jsfiddle.net/gEtGW/1/

如果您对此有任何想法，请告诉我。

谢谢!

编辑:

Answer 1

在您的 HTML 中，您有这个...

<table class="inner-table">
    <colgroup>
        <col width="83">
        <col width="92">
        <col width="123">
        <col width="120">
        <col width="177">
        <col width="84">
    </colgroup>

上面所有的宽度总和为 679。

但是，在您的 CSS 中，您有这个...

.inner-table {
    width: 680px;
}

我不确定每个浏览器应该如何处理额外/缺失的像素，或者它们如何决定一个像素的差异是一个额外的像素还是缺失一个像素。 679 与 680...哪个优先？

不过，我确信每个浏览器可能会以不同的方式呈现它。