我正在开发一个带有博客部分的网站。我需要这个部分有固定的高度。为了能够看到博客中的所有帖子,我添加了一个溢出:自动所以它会在需要时显示滚动条。
<div id="container">
<div id="content">
<div class="post">
This is a long post....
</div>
<div class="post">
This is a long post....
</div>
<div class="post">
This is a long post....
</div>
....
....
....
....
</div>
</div>
#container {
overflow: hidden;
}
#content {
height: 200px;
overflow: auto;
border: 1px solid red;
}
.post {
margin: 20px 0;
}
我在 Chrome、Firefox 和 IE 上对此进行了测试。 Firefox 和 IE 上的网站按预期工作,但 Chrome 虽然在帖子列表大于容器时显示滚动条,但会在容器下添加一个与帖子列表大小相同的白色间隙。
我创建了一个小提琴,但无法重现 Chrome 的行为:
http://jsfiddle.net/u5d56/3/
Using 溢出:滚动而不是 auto 给了我相同的结果。
有任何想法吗?
提前致谢
我找到了解决问题的方法。由于某种原因,为了在 Chrome 中工作,我必须添加一个职位:亲属规则到#content:
#content{
position: relative;
height: 200px;
overflow:visible;
border 1px solid red;
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)