Question

我无法在IE 11上正确呈现灵活的盒子，但是当我更换时：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

通过

<!DOCTYPE html>

这很好用。

有人可以告诉我为什么吗？这是一段代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <style> 
            td {
            background: #eee;
            border: 1px solid;
            }

            .flex-container {
            display: flex;
            flex-direction:column;
            width: 400px;
            height: 250px;
            }

            .flex-item {
            display:block;
            }

            </style>
    </head>
    <body>
        <table>
            <tr>
                <td>normal cell</td>
                <td>normal cell</td>
            </tr>
            <!-- my flexibal container-->
            <tr class="flex-container">
                <td class="flex-item">flex item 1</td>
                <td class="flex-item">flex item 2</td>
            </tr>
        </table>
    </body>
</html>

Answer 1

HTML 4.0 doctype将始终触发怪癖模式。如果您必须使用旧版doctype，例如因为您需要依赖于几乎标准模式，请使用HTML 4.01 doctype，而不是HTML 4.0：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

否则，严肃地说，只要坚持使用新的doctype。

Flex框不适用于doctype HTML 4.0 Transitional

1 个答案: