0

我正在尝试创建一个位于论坛左侧并填充浏览器窗口高度的 100% 的 div。当您滚动时，它也会保持在固定位置。

到目前为止，我的代码在 Chrome 和 FF 中运行良好；但是，在 IE 中，当您继续向下滚动页面时，滚动条会展开，就像页面在增长一样。

#sidebar {
   background-color: #a75143;
   width: 240px;
   height: 100%;
   position: fixed;
   _position:absolute;
   top: 0;
   _top:expression(eval(document.body.scrollTop));
   left: 0;
   bottom: 0;
}

我知道是什么原因造成的—— _top:expression(eval(document.body.scrollTop)); --但这也是让 div 在 IE 中保持固定位置的原因。

此外，溢出：隐藏没有效果。

如果您想了解我在说什么，请在 Internet Explorer 中打开此页面。

任何帮助，将不胜感激。谢谢！

4

2 回答 2

1

即使对于 IE，您也不应该需要该表达式。

以下对我来说很好......

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html lang="en">
<head>

    <style type="text/css">
        #sidebar {
           background-color: #a75143;
           width: 240px;
           height: 100%;
           position: fixed;
           top: 0;
           left: 0;
           bottom: 0;
        }
    </style>

</head>

<body>
    <div id="sidebar"></div>
</body>
</html>
于 2012-09-13T20:02:29.267 回答
0

我能够在我的论坛上使用一些条件 CSS 和无效声明来解决这个问题。但是，上述 Jeremy 的解决方案在 ProBoards 之外效果最佳。

html, body { height: 100%; }
#sidebar {
   background-color: #a75143;
   width: 240px;
   height: 100%;
   position: fixed;
   _position:absolute;
   top: 0;
   _top:expression(eval(document.body.scrollTop));
   left: 0;
   bottom: 0;
}
</style>
<!--[if IE]>
<style type="text/css">
#sidebar-container { min-height: 100%; overflow: hidden; }
</style>
<![endif]-->

<div id="sidebar-container">
   <div id="sidebar">
      some content
   </div>
</div>
于 2012-09-13T21:19:38.113 回答