相关文章推荐
一直单身的匕首  ·  Java ...·  7 月前    · 
老实的高山  ·  vuepress 内存溢出-掘金·  1 年前    · 

在某些版本的 Windows 10 上,通过 Microsoft Edge 更新永久禁用已停用的不支持的 Internet Explorer 11 桌面应用程序。 有关详细信息,请参阅 Internet Explorer 11 桌面应用停用常见问题解答

本文讨论一种设计行为,即如果在 Internet Explorer 中对 <div> 表单元格中的标记使用相对高度,则会调整表的大小。

原始产品版本: Ie
原始 KB 编号: 2778473

如果对 <div> 表单元格中的标记使用相对高度,则可能在 Internet Explorer 中遇到不同的标准模式和怪癖模式的布局行为。 例如:

<!DOCTYPE HTML>
        <div style='height: 75px'>
            <table style='height:100%'>
                    <td>Row 1</td>
                    <td style='height:100%'>
                        <div style='height:100%'>Row 2</div>
            </table>
    </body>
</html>

如果使用开发人员工具切换文档模式,在检查布局时将看到不同的行为。

在上面的示例中,在 quirks 模式下,表获取周围 <div> 元素的高度,即 75 像素。 第二行采用所有剩余高度,并且表本身不会调整大小。

在标准模式下,表会调整大小,因为 <div> 表第 2 行 (第 2 行的内部标记) 采用第一个父级的计算高度,绝对高度为 75 像素。 这会导致整个表的大小调整,因为两行都不适合初始给定的高度。

此行为是设计而来的,已在 2006 年引入 Internet Explorer 7。 你可能还会在非 Microsoft Web 浏览器中看到不同的行为。 目前无法仅使用 CSS 和表更改此行为。 该行为被视为标准模式下表模型的限制。 CSS 表模型实际上阻止此方案按预期工作。

出于兼容性原因,只有 quirks 模式和 quirks 模式仿真 (QME) 才支持此功能。