html - 如何先加载父内容的背景？

Question

我有这样的设计:

<div id='container'>
 <div class='box'>
  <div class='boxleft'>something left</div>
  <div class='boxright'>something right</div>
  <div class='clear'/>
 </div>
</div>

我将 CSS 设置为:

*{margin:0; padding:0}
.clear{clear:both}
#container{width:100%; height:auto; background:#f1f2f3}
.box{width:95%; margin:0 auto; height:auto; background:white}
.boxleft{float:left;width:49%;margin-right:1%;}
.boxright{float:right;width:50%;}

问题:类.box 的背景是白色的，在类.boxleft 完成加载后加载。我现在希望它按照类 .boxleft 的高度加载背景。那么，我该怎么做呢？

感谢您的建议。

Answer 1

您的问题是左浮动和右浮动的结果，而主框内的两个框都没有高度。将此添加到您的 .boxleft 和 .boxright:

display:block

这应该有效。