为什么此页面在 Internet Explorer 中无法正确呈现?

发布于 2024-08-13 18:36:36 字数 189 浏览 3 评论 0原文

看看这个页面: http://labs.pieterdedecker.be/hetoog/layout.htm

看起来不错在 Firefox 中,但 IE 搞砸了。怎么会?

Have a look at this page:
http://labs.pieterdedecker.be/hetoog/layout.htm

It looks alright in Firefox, but IE messes it up. How come?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

万人眼中万个我 2024-08-20 18:36:36

你的布局有点有趣。您可以将其取出并使用以下方式实现居中,而不是在页面两侧使用空表格单元格,

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 。

Your layout is a bit interesting. Instead of using empty table cells on either side of the page, you could take those out and achieve the centering using

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

And you HTML could be something like this:

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

With this method IE will not take up any more space than other browsers and will fit nicely inside the 750px wide container.

EDIT:

To get the header bar stretch horizontally 100%, you must make another div for the content. So, instead of using the body element to set the width, use something like this:

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

And in CSS:

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

This way you can have the table above wrapper to be 100% wide (just style it so), and the wrapper itself is 750px wide.

白日梦 2024-08-20 18:36:36

问题是

在 IE6.0 中   不支持。

指定 IE6 不支持的  

和 PNG 图像的宽度。

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

文件: iepngfix .zip (40kb) 将解决问题

The problem is

In IE6.0 <td> </td> wont support.

Specify width for the <td width="20%"> </td>

and PNG Images not support in IE6.

Download from http://www.twinhelix.com/css/iepngfix/

file : iepngfix.zip (40kb) will solve the problem

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文