ads
ads
ads
ads
ads
МЕНЮ:
Главная Сотовая связь Софт Веб-мастеру Графика Железо Portable Игры Интернет Чудеса Науки Apache Delphi Drupal Flash Html Юмор Каталог ноутбуков FAQ
загрузка...


О железках:
iPhone XS «разрывает» AnTuTu
Xiaomi начала продавать топовую версию Mi 8 в белом корпусе
Apple заработала на продаже смартфонов больше, чем все остальные, вместе взятые
Представлен защищенный музыкальный смартфон AGM H1
Xiaomi предлагает купить сеты своих флагманов по цене новых iPhone
Топ новостей
О софте:
"Лунная деревня" приобретает очертания
BASSLET — гаджет любителей клубов
Хакеры способны взломать кардиостимуляторы
Новосибирские физики построят коллайдер
Китай изучит гравитационные волны


Age Of Comp » Html » Мультиколоночность

Мультиколоночность

Все мы ждем мультиколоночность. Для этого в CSS3 введено много вкусного,
column-count:  <int>
column-gap:  <length> | auto
column-width:  <length> | auto


но, не дожидаясь принятие CSS3, мозильци поддержу мультиколоночнисти в Firefox используя спец префикс -moz- в стилях,
-moz-column-count:  <int>
-moz-column-gap:  <length> | auto
-moz-column-width:  <length> | auto


и как водится дурной пример оказался заразителен для ребят из Apple
-webkit-column-width: <length>;
-webkit-column-gap: <length>;


Это, как вы уже наверно поняли, были стили под Safari.

Как бы быстро все браузеры не поддержали css3 или используя теги FF и Safari, надо обратить внимание на одну штуку. Разделять на колонки не всегда обязательно через column-count, конечно вы можете обозначить числом нужные вам колонки, но можно делать и по другому. Если указать только параметры column-width и column-gap то браузер сам поделит пространство на колонки. Например, если div шириной 400px и ты ставим column-width:100px и column-gap:20px то колонок будет 3. Уменьшите ширину в column-width и количество колонок увеличится


Нравится пост? Жми: