47 комментариев на «Display: inline-block, или на грани кроссбраузерности»

15. 

    Andrey Leonidov (1 комментарий)

    16 марта, 2013 в 11:24

    Наверно в следующей версии CSS будут включены if-ы для IE6 и IE7 :))

    Ответить на этот комментарий
16. 

    Vova (1 комментарий)

    21 марта, 2013 в 17:54

    Здравствуйте.
    Не понял как вы в первом примере пробелы установили. Возможно они заложены в id="content2". Но css с этим id в коде не вижу.

    Ответить на этот комментарий
    • 

      Княгиня (660 комментариев)

      26 марта, 2013 в 02:15

      В первом примере пробелы присутствуют в коде html. Именно этим отличаются пробелы от отступов, задаваемых через css. Во втором примере пробелов нет — элементы написаны без разрывов.

      Ответить на этот комментарий
17. 

    Oleg (1 комментарий)

    22 марта, 2013 в 14:22

    Только учусь! смотрю регулярно Ваш блог. Спасибо!

    Ответить на этот комментарий
18. 

    Roman (1 комментарий)

    29 марта, 2013 в 13:42

    О Спасибо попробуем!

    Ответить на этот комментарий
19. 

    uhuru (1 комментарий)

    2 июля, 2013 в 17:55

    Чтобы избавиться от пробелов между inline-block элементами можно задать родителю font-size:0px;, а нужный размер задать уже внутри элементов.

    Ответить на этот комментарий
    • 

      Княгиня (660 комментариев)

      25 июля, 2013 в 00:48

      Это один из вариантов. Просто раздражает необходимость лишних движений.

      Ответить на этот комментарий
20. 

    Вячеслав (1 комментарий)

    18 сентября, 2013 в 00:31

    А что думаете по поводу такого решения данной проблемы?
    http://rmcreative.ru/blog/post/displayinline-block-dlja-vsekh-brauzerov

    Ответить на этот комментарий
    • 

      Княгиня (660 комментариев)

      18 сентября, 2013 в 00:50

      А чем это отличается от описанного в моей статье? Если, конечно, выкинуть хаки под сильно устаревшие версии браузеров.

      Ответить на этот комментарий
21. 

    sarandon (3 комментария)

    18 сентября, 2013 в 10:57

    абсолютно кроссбраузерно, имхо
    использую для «плитки» разводящих каталогов в интернет-магазинах вместо float: left
    проблем пока не замечено…

    .anydiv ul li {
      width: 274px;
      min-height: 120px;
      display: -moz-inline-stack;
      display: inline-block;
      vertical-align: top;
      margin: 5px 0 30px 23px;
      zoom: 1;
      *display: inline;
      _height: 120px;
    }

    Ответить на этот комментарий
    • 

      Княгиня (660 комментариев)

      18 сентября, 2013 в 11:10

      Предыдущий комментатор дал ссылку ровно с таким же рецептом. И в обоих случаях я вижу хаки под устаревшие браузеры — например, под старые версии ФФ. А я тоже пользуюсь inline-block для разного рода плашек, будь то баннеры, блоки в слайдере, блоки товара в каталогах, и пр., но без всех этих старомодных дополнений — и оно работает.

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

      Ответить на этот комментарий