css - IE8 CSS 渲染问题(表格)

Question

我的网站有一个很常见的 IE8 问题。 IE8 以不同于其他浏览器的方式呈现我的页面，这很烦人。如果有人可以提供帮助，我很乐意!

我曾尝试为 IE8 提供自己的样式表，但它似乎不起作用。

这是有问题的页面:

http://www.routeqr.com/toimex/tuotteet

向下滚动到图片部分，您会看到第一列和第二列之间的空间太大。

TH 标签也呈现错误。

IE 不能在那里正确呈现边距，只需使用 Firefox 或其他浏览器检查同一页面，您应该会看到不同之处。

如果有人能帮助我，我将不胜感激，我迷失了自己。

HTML 代码

<table class="tuotekuvat">
<tbody>
<tr>
<th><a name="kannakkeet">&raquo; Kannakkeet</a></th>
</tr>

CSS

.custom .tuotekuvat th {
float: left;
margin-top: 15px;
margin-bottom: 15px;
padding: 10px;
background-color: #333333;
}

Answer 1

表格编码不正确，你有一个th (单元格)没有 colspans指定，并在 table本身有些行有 6 个单元格(列)，有些有 5 个。任何浏览器都可能有问题 ;)

那你是漂单th - IE 7 及以下版本不理解表格单元格/标题元素上的 float ，并将强制整个第一列与标题链接一样宽

如果我可以建议您坚持一种或另一种方法，要么将标题 float 到表格外，要么甚至将其放在自己的表格中 <thead>元素 - 然后使用 table-layout: fixed在整个表格上，以便强制列的宽度相等。这应该有助于平衡它......但主要是如果你决定该表有六列(无论是否使用它们)然后例如单个th应该是 <th colspan="6">

首先让表格 HTML 正确，其余的在浏览器中应该完全没问题，如果你想让表格行和表格标题之间看起来有间隙，你可以填充 th .. 但我真的不认为它需要 float 在表结构之外