看看这个简单的页面:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
body {padding:20px;}
#outer {background-color:#ff0000;}
#inner {width:500px; border:1px solid #0000ff;}
</style>
</head>
<body>
<div id="outer">
<div id="inner">
<p>Why the hell outer div bg color does not expand?</p>
<p>Why the hell outer div bg color does not expand?</p>
<p>Why the hell outer div bg color does not expand?</p>
</div>
</div>
</body>
</html>
当浏览器页面缩小到 <div id="inner"> 宽度以下时(即本例中的 500px)，然后将浏览器页面向右滚动，您将看到内部 div 的右侧不再有红色背景:
你知道如何修复 outer <div> 的背景吗？为了让它永远不会缩小到inner <div>以下width???(我仍然需要 outer div 背景来扩展到整个浏览器宽度，所以它不能也设置为 width:500px;)。
编辑: 换句话说，我希望看到外部 div 的红色背景颜色填充内部 div 的总 500px 宽度，而不是缩小到浏览器大小，离开右侧没有红色背景的内部 div。为了做到这一点，我不能简单地将外部 div 也设置为 500px，因为当浏览器展开时，我也需要红色背景色来展开。
最佳答案
将此添加到您的 CSS 中
#outer {background-color:#ff0000; min-width: 500px;}
关于CSS - 使外部 <div> 背景扩展到内部 <div> 宽度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10014766/