CSS背景和水平滚动条
[英]CSS backgrounds and horizontal scrollbars
问题描述
谁能启发我为什么这个测试用例会发生以下情况？
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: #ffffff;
margin: 0;
padding: 0;
}
.section {
background-color: #000000;
color: #ffffff;
}
.wrap {
width: 960px;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="section">
<div class="wrap">Some content here</div>
</div>
</body>
</html>
当窗口大到足以容纳960px时，一切都会按预期进行。
当窗口大小调整为小于960px时，出现水平滚动条（如预期）。 但是，在水平滚动时，似乎.section div尚未在文档中拉伸，而仅显示为窗口的宽度，因此显示了正文的白色背景。
我通常希望黑色的.section div在文档中延伸，因为它是display：默认为block。
有谁知道为什么会这样，更重要的是，如何获得我期望的结果？
干杯
2 个解决方案
解决方案1
1 已采纳 2014-03-26 22:02:21
这是因为您的部分的威力与它的内容一样大。 在这种情况下，这意味着您的包装器设置为960px。 将部分设置为百分比只能用作可用屏幕的百分比，因此width：100％不能解决此问题。 您应该将断面宽度设置为特定数字，这样可以解决此问题。
编辑：使用最小宽度而不是宽度，并且当您大于最小宽度时，效果更好。
解决方案2
0 2014-03-26 21:58:32
部分调整大小，尝试在.section上设置width：100％
此外，您可能需要将此添加到.wrap
保证金左：自动; 保证金右：自动;
这将使包装div居中
CSS：带边框的div中高度/宽度为100％的DIV会创建垂直滚动条，而不是水平滚动条
[英]CSS: 100%-height/width DIV inside a bordered div creates vertical, but not horizontal scrollbars
如何自动调整CSS的宽度，以便水平滚动条可以自动调整而不占用太多空间？
[英]How to Automatically adjust width in CSS so horizontal scrollbars would adjust automatically without taking so much space?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.