рендеринг div вне контейнера

Question

Я запустил шаблон на странице, и по какой-то причине один из моих DIV (#content) выполняет рендеринг вне основного div «контейнера». Я посмотрел и посмотрел, и не могу ничего найти. Что-то не так с моим кодом?

Заранее спасибо.

Кыз

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

Хорошо, похоже, проблема в том, что вы ясно: оба;элементы были открытыми.Должны были быть сломаны метки.Так что в основном это, казалось, решило большинство вещей.Ты не уверен, почему в #top должна быть установлена ​​высота: 100px ;, если элементы внутри задают высоту в любом случае .. даже если они плавают ..., тогда будет установлено окончание.http://jsfiddle.net/hobobne/qxYHN/1/