2

我的网站顶部有一个如下所示的元素：

#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 不行。看起来水平滚动条的高度（大约 15 像素）计入 #main 元素的高度。所以#main 元素底部的15px 高度区域隐藏在#footer 元素后面。

请你帮助我好吗 ？

编辑：这是一个问题的例子......

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

使用 Chrome 和 Firefox，您可以看到整个黄色方块 (30x30px)。但是在 IE9 中，您看不到隐藏在红色页脚后面的黄色方块的底部。

4

1 回答 1

2

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

尝试将其包装在<div>包含width类似内容的内容中：

HTML：

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

CSS：

#maincontainer{
  width:3000px;
}
于 2013-03-17T08:58:01.917 回答