我在相对大小的垂直 div 内创建溢出时遇到问题。
这是一个小提琴:http: //jsfiddle.net/ZgL59/
基本上,我有一个大的垂直列,里面有两个基于百分比的 div。底部 div 的内容比 div 大,上面有 overflow-y:scroll。
但是,正如您在小提琴中看到的那样,根据浏览器的不同,底部的内容会被截断(小提琴中的最后一个“Y”并不完全可见)。这取决于浏览器。有解决办法吗?我不想掉进试图取悦每个具有不同高度的浏览器的兔子洞。
这是HTML:
<div class="container">
<div class="inner1">X</div>
<div class="inner2">
Tons of Content...
</div>
</div>
和CSS:
html, body {
height:100%;
overflow:hidden;
}
.container {
height:100%;
background:blue;
}
.inner1 {
height:30%;
background:red;
}
.inner2 {
height:70%;
background:green;
overflow-y: scroll;
}