[/quote]
Не за что.
Это не глюк.
На самом деле это поведение, наряду со схлопыванием верхних и нижних полей элементов, является попыткой заставить блочную модель CSS нормально вести себя в условиях простого потока текста.
Если в одном из абзацев встречается изображение, может возникнуть необходимость сдвинуть это изображение, например, влево (float: left, чтобы текст обтекал его с правой стороны. Если сдвигаемое изображение будет занимать по высоте больше, чем текст первого обтекающего его абзаца, и если оно при этом будет растягивать этот абзац и отодвигать начало следующего абзаца ниже, то это будет выглядеть некрасиво из-за увеличения расстояния между этими абзацами. В связи с этим изображение и проваливается через границы всех абзацев, сохраняя между ними одинаковое расстояние, в то время как текст этих абзацев соответствующим образом его обтекает.
Описанное выше поведение удобно для форматирования текста в прямом потоке, но в то же время создает проблему "проваливания" при раскладке элементов на странице с использованием свойства float. С этой проблемой Вы и столкнулись.![]()
Зачем лишний див?Это не есть хорошо, если можно обойтись и без него.
![]()
[/quote]
Вы совершенно правы.
Автор действительно не указал с самого начала всех тонкостей и нюансов.![]()



, чтобы текст обтекал его с правой стороны. Если сдвигаемое изображение будет занимать по высоте больше, чем текст первого обтекающего его абзаца, и если оно при этом будет растягивать этот абзац и отодвигать начало следующего абзаца ниже, то это будет выглядеть некрасиво из-за увеличения расстояния между этими абзацами. В связи с этим изображение и проваливается через границы всех абзацев, сохраняя между ними одинаковое расстояние, в то время как текст этих абзацев соответствующим образом его обтекает.
