IE 7/8 рендеринг Iinline (Floated Divs) в виде блока: ширина не подстраивается под содержание?

Question

У меня есть блочный элемент (DIV), который растягивается на всю страницу. Он содержит несколько плавающих DIV переменной ширины. Этот элемент может существовать на многих веб-страницах (любой может разместить его на своем веб-сайте). В FF на всех сайтах он отображается правильно, а плавающие DIV имеют ширину, равную их внутреннему содержанию. В IE это работает иногда, но на других сайтах это не так, и вместо этого он растягивает каждый перемещенный DIV на ширину родительского элемента, чего не должно быть. Прикрепленное изображение - дополнительная иллюстрация (красный DIV - контейнер, черные DIV - плавающие).

http://img8.imageshack.us/img8/4734/screenrrl.jpg (Изображение является фотошопом, а не реальным HTML-рендером)

Answer 1

Нашел это! Проблема в том, что я использовал один DIV, чтобы очистить все элементы внутри родителя. Некоторые режимы рендеринга в IE имеют проблемы с этим. Вместо этого я заменил его, добавив класс clearfix к родителю!

Answer 2

вы можете использовать это исправление для ul (я полагаю, оно используется на скриншоте):

#list { overflow: hidden; zoom: 1; }

вместо " clear: both; ".