我有一个使用位置绝对元素的叠加层。 overlay 元素可以包含比视口(viewport)中内容更多的内容,因此位置固定并不能解决问题。目前叠加层的背景颜色只是视口(viewport)的大小,而不是浏览器的大小。这会弄乱内容。
检查 plunker 的例子,http://plnkr.co/edit/r37LE4BhvW7UkNWPfsJN?p=preview
html, body{
margin: 0px;
height: 100%;
}
.absolute{
position: absolute;
width: 100%;
top:0;
right:0;
height: 100%;
min-height: 100%;
background-color: blue;
}
最佳答案
改变这个
html, body{
margin: 0px;
height: 100%;
}
.absolute{
position: absolute;
width: 100%;
top:0;
right:0;
height: 100%;
min-height: 100%;
background-color: blue;
}
到
html, body{
margin: 0px;
height: 100%;
}
.absolute{
position: absolute;
width: 100%;
top:0;
right:0;
**height:auto;**
min-height: 100%;
background-color: blue;
}
重要的是height:auto;
关于css - 使用 CSS 给一个绝对元素 100% 浏览器高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34257341/