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


О железках:
iPhone X попал в список лучших изобретений года
HMD Global отгружает «звонилки» Nokia десятимиллионными партиями в месяц
Замечен загадочный флагман Sony на процессоре Snapdragon 845
Xiaomi выпустила дешевый фонарик Portable Flashlight
Lenovo представила еще один бюджетный планшет Tab 7 Essential
Топ новостей
Oppo R11s получил более 300 тыс регистраций в первые 24 ...
Oppo R11s получил более 300 тыс регистраций в первые 24 ...


Приложение Radarius «разжигает искру» между пользовател ...
Приложение Radarius «разжигает искру» между пользовател ...


Sony представила смартфоны среднего класса Xperia R1 и  ...
Sony представила смартфоны среднего класса Xperia R1 и ...


Открылись предзаказы на юбилейный iPhone X
Открылись предзаказы на юбилейный iPhone X


Как отследить предзаказанный iPhone X
Как отследить предзаказанный iPhone X


Дебютировал смартфон среднего класса HTC U11 Life
Дебютировал смартфон среднего класса HTC U11 Life


Microsoft выпустит складной девайс Andromeda
Microsoft выпустит складной девайс Andromeda


BLU Vivo 8L с 20-Мп селфи-камерой представлен официальн ...
BLU Vivo 8L с 20-Мп селфи-камерой представлен официальн ...


Названа дата выхода глобальной стабильной Xiaomi MIUI 9
Названа дата выхода глобальной стабильной Xiaomi MIUI 9


Полный список технических характеристик Xiaomi Redmi No ...
Полный список технических характеристик Xiaomi Redmi No ...


О софте:
"Лунная деревня" приобретает очертания
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 и количество колонок увеличится


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