Поплавки не очищаются должным образом в IE - как исправить? - PullRequest
1 голос
/ 30 апреля 2010

Я уже час бьюсь головой, и я разобрал проблему до самого простого примера, который я могу себе представить, который показывает проблему.

CSS / HTML

<style>
  #T div { float: left; }
  ._b { clear: left; }
</style>

<div id='T'>
    <div class='_a'>*</div>
    <div class='_b'>*</div>
    <div class='_c'>*</div>
    <div class='_d'>*</div>
</div>

IE7

***
*

FF, Chrome, Opera

*
***

Результат в FF / Chrome / Opera - это то, что я ожидал. Там нет добавления дополнительной разметки, чтобы исправить это, и я совершенно сбит с толку, как заставить его работать должным образом в IE.

Становится ужасно, когда вы говорите, что 3 - все подряд, а 3 - на одной линии - дополнительные 2 оказываются в первом ряду.

Я действительно надеюсь, что кто-то знает обходной путь для этого.

Установка ширины плавающих элементов div не помогает и не имеет ширины родительского элемента, потому что это простой пример. Представьте, что в каждой строке может быть 1-5 элементов, и тогда вы сможете увидеть проблему.

Ответы [ 2 ]

0 голосов
/ 11 ноября 2010
.clearfix:before, .clearfix:after {content: "\0020"; display: block; height: 0; visibility: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

Просто примените класс clearfix к элементам, которые вы хотите очистить, этот css позаботится о проблемах во всех браузерах. Рекомендую ознакомиться с вопросом, предоставленным по ссылке Blender3D.

0 голосов
/ 11 ноября 2010

Это похоже на углубленную оценку причуд IE. Проверьте это, может быть, это поможет;)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...