Общей проблемой, которая у меня есть с веб-страницами, являются плавающие divs, ползущие за пределами их контейнеров.
#wrapper{
border:1px solid red;
}
#wrapper div{
float:left;
font-size: 3em;
}
...
<div id="wrapper">
<div>Hello World</div>
</div>
Пример в реальном времени: http://jsfiddle.net/ugUVa/1/
Есть много грязных способов исправить это (вставка div с ясными: оба)
Многое более ясное решение, которое я видел, устанавливает стиль переполнения divs divs скрытым:
Пример: http://jsfiddle.net/ugUVa/2/
Это хорошо работает в браузерах, красиво и чисто, без дополнительной разметки. Я счастлив, но я понятия не имею, ПОЧЕМУ он работает!
Вся документация, на которую я смотрел, указывает на переполнение: скрытый предназначен для скрытия содержимого, а не для изменения размера родителя для его детей...
Может ли кто-нибудь предложить объяснение этому поведению?
Спасибо
