0

我在相对大小的垂直 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;
 }
4

1 回答 1

1

如果我正确地认为“切断”是什么意思,请参阅this fiddle,将marginandpadding设置0px在身体上应该可以解决它。在 Chrome、FF 和 IE10 中测试,看起来不错(再次,如果我理解这个问题)。

于 2013-11-12T12:43:56.193 回答