14 html css scroll internet-explorer-7
我的网站是大学的课程目录工具,它有一个中心窗格,其中包含动态更新的类列表.在Firefox,Opera和Chrome中,中心窗格具有预期的滚动行为:当类列表超出高度时,中心窗格具有滚动条.但是,只有在明确设置高度时,IE才显示此栏.在调整大小时不使用JavaScript重置中心窗格高度,如何强制Internet Explorer显示滚动条?
中心窗格:
<div id="middlenav">
<div id="middleheader"></div>
<div id="courselist"></div>
</div>
Run Code Online (Sandbox Code Playgroud)
和它的CSS:
div#middlenav {
position: absolute;
left: 250px;
right: 350px;
top: 0px;
bottom: 0px;
}
div#courselist {
overflow: auto;
position: absolute;
top: 55px;
bottom: 0px;
width: 100%;
}
Run Code Online (Sandbox Code Playgroud)
看起来中心窗格不符合bottom: 0px;语句,并且正在扩展到包含的全部高度#courselist.我尝试了,body { height: 100% }但也没有解决它.
"该
top物业将覆盖该bottom物业......" https://developer.mozilla.org/en-US/docs/CSS/bottom
更改top到auto的,而不是0px:
div#middlenav
{
position: absolute;
left: 250px;
right: 350px;
top: auto;
bottom: 0px;
}
Run Code Online (Sandbox Code Playgroud)
这应该可以解决底部定位问题.请记住,如果#middlenav绝对定位,它将相对于任何父元素具有position:absolute;或position:relative;.如果#middlenav没有定位的父元素,它将相对于<body>.
我不确定你为什么#courselist绝对定位; 因为它在里面,#middlenav我认为你可以保持静态或相对定位.但无论你做什么,我认为你需要一个高度设置#courselist或#middlenav.height的默认值为auto,因此不会有滚动条,因为该元素将展开以适合其内容.
我知道这个问题是在3年前被问到的,但是我发布这个问题给其他可能有CSS定位问题的人.干杯!
位置:绝对;底部:0px;将元素设置在元素的底部。但它必须知道元素的底部在哪里。如果将高度设置为 100% 或将其放置在位于底部的另一个元素中:0px; 然后它不知道底部在哪里,除非这些元素之一位于内部(占据其整个高度)并且具有固定大小的元素。你不能给身体 100% 的高度,因为它会永远持续下去。尝试指定主体或某些包含元素的高度。:D
| 归档时间: |
|
| 查看次数: |
41572 次 |
| 最近记录: |