Quirks 模式表格和文本对齐问题

发布于 2024-08-22 12:35:08 字数 1798 浏览 4 评论 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>

我必须以怪异模式渲染此代码（由于页面中存在 Iframe，为了正确渲染它，我发现怪异模式最适合）。我看到 IE8 显示的代码为：
_{（来源：ggpht.com)}

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

_{（来源：ggpht.com)}

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

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

原文

I have the following html code snippet :-

<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>

I have to render this code in quirks mode(Due to an Iframe in the page, to render it properly I found that Quirks mode suits the best). I see that IE8 displays the code as:

_{(source: ggpht.com)}

Table not aligned with the other list items.
Whereas mozilla displays it as :-

_{(source: ggpht.com)}