个人中心
gpt4 book ai didi

css - IE9-10 高度 : 100% doesn't work

转载 作者：行者123 更新时间：2023-11-28 12:35:11 27 4
gpt4 key购买 nike

当我在表格单元格 div (#cell-2) 中放置一个绝对定位的 div (#window) 时，#window 在 IE9 和 10 中不显示。但它在其他浏览器中工作正常。我在这篇文章的末尾放了一个 fiddle 来演示这一点。

这是 html:

<body>
    <div id="table">
        <div id="cell-1"></div>
        <div id="cell-2">
            <div id="window"></div>
        </div>
    </div>
</body>

这是 CSS:

html, body{
    height:100%;
}

#table{
    display:table;
    width:100%;
    height:100%;
    background-color:blue;
}

#cell-1{
    display:table-cell;
    height: 100%;
    width: 210px;
    background-color:black;
}

#cell-2{
    display:table-cell;
    position:relative;
    height:100%;
    background-color:green;
}

#window{
    position:absolute;
    overflow-y:scroll;
    overflow-x:hidden;
    background-color:yellow;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

You can find the fiddle here .您会注意到屏幕的右侧部分在非 IE 浏览器中正确显示了黄色的 div。但是使用IE9和IE10时显示绿色div。

值得注意的是#window是一个动态生成的模态窗口，应该覆盖#cell-2不一定为空的内容。溢出是必需的。

这个问题似乎与 IE 似乎忽略 height:100% 的事实有关；因为高度:100px；例如将按预期显示。

如有任何帮助，我们将不胜感激。谢谢

最佳答案

从#window 类中删除 position:absolute 并尝试，它有效!!

#window{
    overflow-y:scroll;
    overflow-x:hidden;
    background-color:yellow;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

关于css - IE9-10 高度 : 100% doesn't work，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27844813/

27 4 0
文章推荐： c# - 如何在页面加载时更改按钮 css
文章推荐： javascript - 我们可以在不使用alert或windows.alert的情况下弹出一个窗口吗
文章推荐： css - 单台 mac osx 机器上的任何浏览器都无法呈现字体
文章推荐： javascript - 删除表中的特定行
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com