Второй плавающий div в chrome очищается перед первым div

Question

Два div находятся рядом друг с другом, оба плавающие слева в оболочке. В IE и Firefox они отображаются правильно, но в Chrome 2-й плавающий div очищается ниже Div A. Когда я удаляю «float: left» в css, он переходит в правильную позицию в Chrome, но очищается в IE и firefox (как это должно). Я не знаю, почему это появляется в Chrome. Есть идеи?

Answer 1

У меня возникла такая же проблема. У меня было два div с float: слева внутри таблицы td - мне нужно было установить стиль таблицы td, чтобы включить style = "text-align: left;" для их правильного выравнивания.

Answer 2

также похожая проблема с плавающими дочерними элементами div. В моем случае ... я плавал окружающий div вправо, который содержал элемент h3 (со свойством text-align), за которым следовали 2 элемента дочернего блока.

Намерение центрировать текст h3 относительно дочерних элементов блока под ним.

-

Проблема? У меня не было набора ширина для дочерних элементов блока. Почему? Я хотел, чтобы ширина содержала различный отступ слева / справа относительно количества текста в этом контейнере. например. отступ: 10px 30px;

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

Answer 3

У меня была проблема, когда у меня был контейнер div с кучей внутренних элементов div, для которых было установлено свойство float: left. Мой последний внутренний div (самый правый) тоже завернут. Я исправил свою проблему, убедившись, что объединенные внутренние элементы div с полями не превышают ширину контейнера div.

Инструмент разработчика Chrome, похожий на firebug, отлично помог мне решить проблему. Для моего контейнера я не устанавливал ширину явно, но инструмент разработчика Chrome мог показать мне унаследованную ширину. Затем я посмотрел на все ширины внутренних блоков, а затем откорректировал часть ширины внутреннего блока.

Answer 4

Я столкнулся с той же проблемой. Chrome неправильно отображает div с плавающей точкой. Блок отображается под первым. Не в сторону, как я ожидал. Решение простое! Окружите оба блока div , которые не имеют других сестринских блоков внутри .

Answer 5

Как насчет настройки отображения: встроенный блок и ширина для обоих div?

РЕДАКТИРОВАТЬ: установка максимальной ширины% 50 для каждого из них будет работать во всех браузерах, кроме IE6, при условии, что не заданы отступы / поля.

Answer 6

1. Без примера кода это на самом деле просто догадка

2. Я не уверен, как работает Chrome, но я знаю, что IE рекламирует свои собственные стили. Вы использовали сброс CSS? большинство кросс-браузерных проблем могут быть исправлены этим.

3. Похоже, что объединенная ширина двух плавающих блоков превышает ширину обертки. Попробуйте установить ширину оболочки равной 100% или нет ширины ... или уменьшите ширину двух плавающих элементов div.

4. есть ли у вас какие-либо свойства отображения: встроенные, блочные и т. Д., Установленные для любого из этих элементов?