Евгений Степанищев

Я — эксперт в области разработки веб-приложений и безопасности в интернете. Каждый месяц мой блог посещают около 90 тысяч человек. Работаю техническим директором в «Системах документооборота», занимаюсь электронным правительством.

«Очистка» плавающих блоков

В блоге «Life Style» полезная статья «„Очистка“ плавающих блоков». Новое решение старой проблемы — плавающие блоки не растягивают внешний контейнер, которая обычно решается добавлением дополнительного элемента с «clear: both». Вкратце, рецепт выглядит следующим способом, но рекомендую взглянуть и на полную статью:
div.container {
	overflow: auto;
	width: 100%
}
В комментариях подсказали ссылку на первоисточник: http://www.quirksmode.org/css/clearing.html.
27 ноября 2007 14:52

razetdinov.moikrug.ru (razetdinov.moikrug.ru)
27 ноября 2007, 17:18

Поразительно, сколько людей копируют чужую идею.
http://www.quirksmode.org/css/clearing.html

Alisey (alisey.myopenid.com)
27 ноября 2007, 23:15

А! Это работает.
Знал один извращённый способ добиться того же эффекта, но он очень нестабилен.
Там используется :after
http://www.positioniseverything.net/easyclearing.html

Недавно нашёл очень полезное, как исправить в IE6 удвоение margin для плавающих блоков. Нужно такому блоку указать display: inline. Не помню где читал.

Ваше имя или адрес блога (можно OpenID):

Текст вашего комментария, не HTML:

Кому бы вы хотели ответить (или кликните на его аватару)

Подсказка по написанию комментария

В комментариях можно применять следующую специальную разметку:

  • слово, обрамлённое в «звёздочки» выделяется *жирным*
  • ссылка становится ссылкой: http://bolknote.ru
  • ссылка в скобках также становится ссылкой, закрывающая скобка не захватывается: (http://bolknote.ru)
  • каждую строку цитаты следует начинать со знака «больше»:
    > это цитата
    > из двух строк
  • можно вставить картинку, залитую на один из сервисов: «Яндекс.Фотки», «Фликр» или «Пикплз». Для этого нужно вставить на страницу полный адрес вашей картинки на сервисе, он превратится в картинку:

    http://fotki.yandex.ru/users/bolknote/view/274311?page=3