Question

我的网站顶部有一个看起来像这样的元素：

#top { position:fixed;top:0;left:0;margin:0;padding:0;height:60px;width:100%; }

我的另一个元素在底部看起来像这样：

#footer { margin:0;padding:0;position:fixed;height:60px;bottom:0;left:0;width:100%; }

在这两个元素之间，我最终在中间有一个#main元素，如下所示：

#main { margin:0;padding:0;position:absolute;top:60px;left:0;bottom:60px;width:3000px; }

Chrome / Firefox / Safari一切正常，但IE9则不行。看起来水平滚动条的高度（大约15px）在#main元素的高度内计算。因此#main元素底部的15px高度区域隐藏在#footer元素后面。

你能帮我吗？

修改：以下是此问题的一个示例...

http://statosphere.fr/stackoverflow/test.php

使用Chrome和Firefox，您可以看到整个黄色方块（30x30像素）。但是使用IE9，你无法看到隐藏在红色页脚后面的黄色方块的底部。

Answer 1

滚动条似乎确实存在IE9特定的问题。

尝试将其包含在包含<div>的{{1}}中，如下所示：

HTML：

width

CSS：

<div id="maincontainer">
    <div id="top"></div>
    <div id="main">
        <div id="element"></div>
        <div id="footer"></div>
    </div>
</div>

IE9的水平滚动条高度问题

1 个答案: