0

我有以下 html 代码片段：-

<html>
<head>
    <style>
        body ul
        {
            margin: 0px;
            border: 1px solid black;
            padding: 0px;
            list-style-type: none;
        }
        ul li {
        display: inline;
            padding: 0px;
            margin: 0px;
            border: 1px solid red;
        }
        table
        {
            display: inline;
            margin: 0px;
            padding: 0px;
            border:1px solid green;

        }

    </style>
</head>
<body>
<ul>
        <li>Item1</li>
        <li>Item2</li>
        <li>
            <table>
                <tbody>
                    <tr>
                        <td>Item3</td>
                        <td>Stars</td>
                    </tr>
                </tbody>
            </table>
        </li>
    </ul>

</body>
    </html>

我必须在quirks 模式下渲染这段代码（由于页面中有一个 iframe，为了正确渲染它，我发现 Quirks 模式最适合）。我看到 IE8 将代码显示为：（ 来源：ggpht.com）替代文字

表格未与其他列表项对齐。而 Mozilla 将其显示为：-

替代文字
（来源：ggpht.com）

此处表格已对齐，但文本未对齐。

这里出了什么问题？如何跨浏览器解决此问题

4

1 回答 1

0

坚持怪癖模式？好的。

看起来表中的 td 有填充，导致它在 IE 中呈现这样的内容。

尝试删除表格后所有元素的填充+边距。

于 2010-02-23T04:41:31.873 回答