我正在使用 960.gs (http://960.gs) 作为我网站的 CSS 框架，我试图在 .container_12 类的背景中着色，而不是在我的 .grid_12 类中添加额外的颜色10px 我在每一边，给网格一点空白来呼吸。
我查看了 960.gs 示例网站，他的背景在 y 轴上重复，无论 .grid_12 或 .grid_16 类中有多大或有什么内容，它似乎都会扩展。
当我想将背景涂成白色(而不是在 y 轴上重复图像)时，我的 .grid_12 看起来好像是 float 的，因此 .container_12 没有高度，因此也没有白色背景。
这是我的相关 HTML
<body>
<div id="logoContainer" class="container_12">
<div id="logo" class="grid_12">
<h1>Logo</h1>
</div> <!-- end #logo -->
</div> <!-- end #logoContainer -->
<div class="clear"></div>
<div id="menuContainer" class="container_12">
<div id="menu" class="grid_12">
<ul>
<li><a href="#" class="selected">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
</ul>
</div> <!-- end #menu -->
</div> <!-- end #menuContainer -->
<div class="clear"></div>
<div id="contentContainer" class="container_12">
<div id="content" class="grid_12">
<p>Content here</p>
</div> <!-- end #content -->
</div> <!-- end #contentContainer -->
<div class="clear"></div>
</body>
和CSS
/* 960.gs */
@import url('reset.css');
@import url('960.css');
@import url('text.css');
#contentContainer
{
background-color: #fff;
margin-bottom: 10px;
border-radius: 20px;
-o-border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}
最佳答案
为了回答我自己的问题，<div class="clear"></div>需要在每个 .grid_ 之后，而不是每个 .container_ 之后
关于css - 无法在 960.gs 容器背景中着色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5120084/