为什么此页面无法在Internet Explorer中正确显示？

Question

看看此页面： http : //labs.pieterdedecker.be/hetoog/layout.htm

在Firefox中看起来还不错，但是IE将其弄乱了。 怎么会？

Answer 1

您的布局有点有趣。 不用在页面的两边使用空的表格单元，您可以将其取出并使用以下方法实现居中

body {
    width: 750px;
    margin: 0 auto;
}

您的HTML可能是这样的：

<body>    
    <table>
        <tr>
            <td class="splash_desc">...</td>
            <td class="splash_photo">...</td>
        </tr>
        ...

通过这种方法，IE将不会比其他浏览器占用更多的空间，并且将非常适合750px宽的容器。

编辑：

要使标题栏水平拉伸100％，您必须为内容设置另一个div。 因此，不要使用body元素来设置宽度，而是使用类似以下内容的方法：

<body>
    <table id="header"><tr>...</tr></table>
    <div id="wrapper">    
        <table>
            <tr>
                <td class="splash_desc">...</td>
                <td class="splash_photo">...</td>
            </tr>
            ...

在CSS中：

#wrapper {
    width: 750px;
    margin: 0 auto;
}

这样，您可以使包装器上方的表格的宽度为100％（只是将其设置为样式），并且包装器本身的宽度为750px。

Answer 2

问题是

在IE6.0中， <td>&nbsp;</td>支持。

为<td width="20%">&nbsp;</td>指定宽度

IE6不支持PNG和PNG图片。

从http://www.twinhelix.com/css/iepngfix/下载

file：iepngfix.zip（40kb）将解决问题