Question

我有以下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>

我必须以怪癖模式呈现此代码（由于页面中的iframe，为了正确呈现它，我发现Quirks模式最适合）。我看到IE8将代码显示为： alt text 表未与其他列表项对齐。而mozilla将其显示为： -

alt text

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

这里出了什么问题？如何在浏览器中修复此问题

Answer 1

坚持怪癖模式？行。

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

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

Quirks模式渲染问题

1 个答案: