У меня проблема с twitter bootstrap, которая выглядит немного странно для меня. У меня есть боковая панель с фиксированной слева и основной областью.
<div>
<div id="sidebar">
<ul>
<li>A</li>
<li>A</li>
<li>C</li>
<li>D</li>
<li>E</li>
<li>F</li>
<li>...</li>
<li>Z</li>
</ul>
</div>
<div id="main">
<div class="clearfix">
<div class="pull-right">
<a>RIGHT</a>
</div>
</div>
<div>MOVED BELOW Z</div>
</div>
#sidebar {
background: red;
float: left;
width: 100px;
}
#main {
background: green;
margin-left: 150px;
overflow: hidden;
}
Внутри основной области у меня есть контент с pull-left и pull-right, который очищается с помощью clearfix.
Проблема заключается в том, что содержимое ниже clearfix-div перемещается ниже содержимого боковой панели.
Я сделал для этого скрипку: http://jsfiddle.net/ZguC7/
Я решил проблему, установив "overflow: collapse" на #main, но я не понимаю его и буду очень рад, если кто-нибудь сможет объяснить, что вызывает эту проблему.