Контейнер для float – блоков

Комментарии

1. 
   1

   agat (08.11.2007) #

   Для ie6 ul{zoom: 1;}

2. 
   2

   Nikita (08.11.2007) #

   А я или точно устанавливаю высоту контейнера, или просто не заморачиваюсь.

3. 
   3

   pepelsbey (08.11.2007) #

   Это называется hasLayout и его включение, делаю zoom:1…

4. 
   4

   Zigzag (08.11.2007) #

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

5. 
   5

   Dimox (08.11.2007) #

   С недавнего времени стал делать так же. Однако этот способ срабатывает не всегда, поэтому в некоторых случаях приходится применять старый – пустой div со свойством clear:both.

6. 
   6

   le`Mur (08.11.2007) #

   2agat, pepelsbey, zoom у меня в опале. Причем абсолютно не заслуженной, просто про height:1%; я узнал раньше. А преимуществ zoom`a не нашел.

   2Nikita
   Очень часто высоту нельзя задавать, а обхватывать должен. Например для background`a

   2Zigzag, Dimox
   Я вместо пустого

   div

   ставлю

   <br clear="all" />

   И работает все как надо, и я рад за семантику. Float контейнерам ставить не люблю. Приходится либо добавлять width:100%; возможность доавления которого встречается редко. Либо соседним блокам ставть clear

7. 
   7

   Nikita (09.11.2007) #

   Очень часто нельзя задавать высоту, если неправильно использовать padding и margin, а так, проблемных случаев не припомню.

8. 
   8

   le`Mur (09.11.2007) #

   Очень часто нельзя задавать высоту, если неправильно использовать padding и margin, а так, проблемных случаев не припомню.

   Я имею ввиду когда у контейнера стоит

   background:url('картинка.jpg') repeat-x 0 100%;

   , а его содержимое динамической высоты.

9. 
   9

   ulmen (12.11.2007) #

   спасибо большое, пригодилось

10. 
    10

    mex (20.11.2007) #

    А я чаще всего использую :after для браузеров + height и min-height для 6 и 7 соответственно.
    Для данного случая получается примерно так:
    ul{
    min-height:1%;
    border:solid 1px red;
    list-style:none;
    padding:5px;
    }
    ul:after {
    display:block;
    content:”.”;
    visibility:hidden;
    clear:both;
    height:0;
    }
    * html ul {height:1%;}

    ul li{
    float:left;
    border:solid 1px blue;
    padding:5px;
    margin:0 5px;
    }

    Хотя с overflow – тоже очень гут

11. 
    11

    le`Mur (20.11.2007) #

    А зачем так много ненужных строк?

12. 
    12

    mex (21.11.2007) #

    Если с нуля делать, то оно, конечно, бессмысленно. А если толстый проект, уже куча цсс понаписана, то всё это множество строк описано в стиле, скажем, .wrapper. Минимально прописываешь стилей для отображения и докидываешь до кучи .wrapper )))

13. 
    13

    мухомор (23.11.2007) #

    Про не знал.
    Спасибо – пригодится

14. 
    14

    Bonusov (15.01.2008) #

    спасибо большое, пригодилоcЬ и не в одном месте

15. 
    15

    rmaksim (30.01.2008) #

    это конечно минимально что можно придумать не вмешиваясь в html код

      overflow:hidden; /*Лекарство*/
      _height:1%; /*оно же для IE*/

    но как сказал Zigzag по обстоятельствам, потому как для выпадающей менюшки при overflow:hidden; соотв. ничего не выпадет

16. 
    16

    sinvlad (05.05.2008) #

    Я программист, но версткой интересуюсь).
    Попробовал вместо

    ul{
       overflow:hidden; /*Лекарство*/
       _height:1%; /*оно же для IE*/

    поставить

    ul{
    position:absolute;
    .... и
       ul li{
    position:relative;

    и вроде работает.

17. 
    17

    Vetlan (18.05.2008) #

    применяю в основном флоат папы, но как уже говорили помогает не всегда. zoom:1 считаю предпочтительным тк в ие5.01 при 1% пропадает весь блок.

18. 
    18

    Пятерка порадовавших меня запросов | PokrovBlog (27.05.2008) #

    [...] <li>Сюда</li>Элементы из кода этого поста привело ко мне 10 [...]

19. 
    19

    Jman (11.07.2008) #

    overflow:hidden; /*Лекарство*/
       _height:1%; /*оно же для IE*/  ---- а как же валидность????

    кстати, а разве оверфлоу для ИЕ6 не наследуется? В том плане что он возмёт и обрежит по высоте 1%. и не будет растягивать.В ИЕ 5 точно свернётся.

    * html ul{
    height:1%;
    overflow:visible;
    }

    Вроде должно катит для всех. но я использую only for IE6

20. 
    20

    Саня (29.12.2008) #

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

21. 
    21

    WebMast (15.02.2009) #

    А почему бы просто не сделать так:
    После зафлоачининых блоков забажить div с параметром clear:both;?

    <div class="clear"></div>

    .clear{
    clear:both;
    }

    Этот вариант не работает?

22. 
    22

    Сачивка Игорь (Juicy) (23.09.2009) #

    2 флоатных блока ложатся в родителя просто указанием overflow:hidden; и height:1%;, без выборки для браузеров (ваш хак для ИЕ). Проверьте!

23. 
    23

    Олег (15.01.2010) #

    WebMast, работает, только не забывай обнулять размер блока div.дабы не было лишних отступов(особенно в ие)
    я делаю добавлениями font-size:0;line-height0;