为什么aside 把header覆盖了？
来源：8-2 慕课网-绝对定位整页布局演示
慕粉1628116899
2016-10-22 15:31
html,body #page{
height:100%;
}
#page{
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
}
header, footer{
position:absolute;
left:0;
right:0;
}
header{
height:150px;
top:0;
}
footer{
height:150px;
bottom:0;
left:0;
}
aside{
width:150px;
position:absolute;
left:0;
top:0;
bottom:0;
}
#content{
position:absolute;
top:150;
bottom:150px;
left:150;
overflow:auto;
写回答
关注
2回答
-
- 有C
- 2016-10-24 12:52:24
absolute的层级效果，DOM中在后面的absolute元素会覆盖前面的，你这个footer也覆盖了aside,老师课件里演示的也是覆盖了的！你可以header下left距离设置为aside的宽度，最好用百分比，可以自适应！
-
- icolors
- 2016-11-14 10:36:26
我试了下和你一样，可以给aside设置margin-top来消除
CSS深入理解之absolute
理解CSSposition:absolute声明，掌握position:absolute高级应用
51956 学习 · 254 问题
相似问题