gpt4 book ai didi

html - CSS 列高滚动

转载 作者:太空宇宙 更新时间:2023-11-04 14:20:57 25 4
gpt4 key购买 nike

我在相对大小的垂直 div 内创建溢出时遇到问题。

这是一个 fiddle :http://jsfiddle.net/ZgL59/

基本上,我有一个大的垂直列,里面有两个基于百分比的 div。底部的 div 中的内容比 div 大,上面有 overflow-y:scroll。

但是,正如您在 fiddle 中看到的那样,根据浏览器的不同,底部的内容量会被截断( fiddle 中的最后一个“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;
}

最佳答案

如果我对“切断”的理解是正确的,请参阅此 fiddle ,将正文的 marginpadding 设置为 0px 应该可以解决这个问题。在 Chrome、FF 和 IE10 中测试并且看起来不错(同样,如果我理解这个问题)。

关于html - CSS 列高滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19929481/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com