Question

我在页面上启动了一个模板，由于某种原因，我的一个DIV（#content）正在主“容器”div之外渲染。我看了看，发现我的代码没有任何问题？

提前致谢。

的Kiz

CSS：

#container {
width:1000px;
margin:0 auto;
background-color:#000;
}

#top {
height:100px;
margin:0px 0px 50px 0px;
background-color:#F00;
}

#navigation {
width:720px;
height:100px;
float:left;
background-color:#0F0;
}

#logo {
width:180px;
height:100px;
float:right;
background-color:#00F;
}

.clear {
clear:both;
}

#content {
margin:0 auto;
background-color:#FF0;
}

这是HTML：

<div id="container">
  <div id="top">
    <div id="navigation">Navigation goes here</div>
    <div id="logo">Logo</div>
    <div class="clear" />
  </div>
  <div id="content">Content goes here
  </div>
</div>

Answer 1

#container {
overflow: auto;
}

Answer 2

好的问题似乎是你的明确：两者;元素是未公开的div。应该是br标签。基本上，这似乎解决了大部分问题。你不确定，为什么#top应该设置高度：100px;，如果里面的元素仍然设置高度..即使它们是浮动的..然后将设置结束。

小提琴：http://jsfiddle.net/hobobne/qxYHN/1/

div渲染外部容器

2 个答案: