Question

我正在构建一个最多5列宽且任意长度的HTML表格;它在div里面。它在FF / Chrome / Safari中看起来很棒，但在IE8中搞砸了：

http://img42.imageshack.us/img42/7209/artistlist.png（我是新用户，所以我无法直接发布图片......）

这是代码：

     <h2 class="blockhead">14 artists found</h2>

    <div class="blockbody">
      <div class="blockrow">
        <font size="+0">
        <div style="max-width: 99.9%;">
        <center><table style="max-width: 99.9%;"><tr>
<td><center><a href="djdb2.php?id=994"><img src="djdb/artist/0/994.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John '00' Fleming</a></center></td>
<td><center><a href="djdb2.php?id=657"><img src="djdb/artist/0/657.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Acquaviva</a></center></td>
<td><center><a href="djdb2.php?id=1120"><img src="djdb/artist/1/1120.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Askew</a></center></td>
<td><center><a href="djdb2.php?id=474"><img src="djdb/artist/0/474.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Dahlbäck</a></center></td>
<td><center><a href="djdb2.php?id=1164"><img src="djdb/artist/1/1164.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Dalagelis</a></center></td>
</tr><tr>
<td><br><center><a href="djdb2.php?id=250"><img src="djdb/artist/0/250.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Daly</a></center></td>
<td><br><center><a href="djdb2.php?id=935"><img src="djdb/artist/0/935.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Debo</a></center></td>
<td><br><center><a href="djdb2.php?id=2"><img src="djdb/artist/0/2.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Digweed</a></center></td>
<td><br><center><a href="djdb2.php?id=1132"><img src="djdb/artist/1/1132.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Peel</a></center></td>
<td><br><center><a href="djdb2.php?id=338"><img src="djdb/artist/0/338.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Selway</a></center></td>
</tr><tr>
<td><br><center><a href="djdb2.php?id=980"><img src="djdb/artist/0/980.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Talabot</a></center></td>
<td><br><center><a href="djdb2.php?id=335"><img src="djdb/artist/0/335.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>John Tejada</a></center></td>

<td><br><center><a href="djdb2.php?id=863"><img src="djdb/artist/0/863.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>Koen Groeneveld</a></center></td>
<td><br><center><a href="djdb2.php?id=1009"><img src="djdb/artist/1/1009.jpg" style="max-width: 140px; max-height: 140px; border: 2px #414141 solid;" hspace=10><br>Mike Shannon</a></center></td>
</tr></table></center></div>
        </font>
      </div>
    </div>

我知道它并不漂亮，但是我在vBulletin之上构建它，所以在编辑代码之前我想确保我确切地知道我需要编辑的CSS样式。我已经尝试了很多很多来自Google，甚至是这个网站的建议，但似乎没有任何东西可以帮助IE让桌子适合div。有人知道我怎么做吗？如果你愿意向我解释一些事情，我愿意尝试任何事情！

Answer 1

我终于解决了这个问题！我不得不添加“table-layout：fixed;”对于表的样式，将表设置为width = 100％，并将其包含在其自己的div中。

Answer 2

如果我没记错（1），如果您在HTML中以标准模式运行，IE8仅支持最大宽度CSS。

您是否指定了DocType？
是HTML吗？ IE8不完全支持XHTML

（1） - 刚刚验证，在Quirks模式下（如果没有指定DocType，你会得到什么），在IE8中忽略max-width。

在IE8中，HTML表水平溢出过了div

2 个答案: