плавающий div теряет класс родителей с явным:

Question

У меня небольшая проблема с попыткой поставить границу вокруг обоих рядов. В настоящее время это только первый ряд.

Я использовал ясно: оба; для новой строки div, но, кажется, убирает стиль родительского div с рамкой.

<style type="text/css">
.box {
    border: 1px solid #E5E5E5;
    border-radius: 4px 4px 4px 4px;
    width: 90%;
}
</style>

<div class="box">
    <div style="float:left; width:150px;">
        Row 1, Column 1
    </div>
    <div style="float:left; width:150px;">
        Row 1, Column 2
    </div>

    <div style="clear:both;"></div>

    <div style="float:left; width:150px;">
        Row 2, Column 1
    </div>
    <div style="float:left; width:150px;">
        Row 2, Column 2
    </div>
</div>

Спасибо

Answer 1

Если вы хотите сохранить ту же структуру HTML, просто добавьте контейнер clear:both после вашего последнего div.http://jsfiddle.net/7cptj/

Answer 2

Попробуйте добавить очищающий div после второго ряда. Это должно решить вашу проблему.

Причина в том, что когда вы перемещаете элемент, вы более или менее выбиваете его из родительского элемента. clear: both помещает пустой элемент относительно ваших плавающих элементов div, таким образом, сохраняя "пространство", которое обычно занимают перемещенные элементы div.