Grid Layout как основа современной раскладки

Скрипты и советы | 27 декабря 2018

Уроки CSS на Хабрахабре, habrahabr.ru, Блог компании Конференции Олега Бунина (Онтико)

В темные века верстальщики строили сайты на таблицах. Потом они освоили float и flexbox, и тьма отступила. В 2017-м наступила эпоха Просвещения с приходом CSS Grid Layout.

Grid учитывает горизонтальное и вертикальное пространство, с ним можно менять раскладку, не трогая разметку, и все это без медиазапросов. С Grid можно забыть про магические числа, хаки, обходные пути и CSS-фреймворки.



Несмотря на всю мощь, есть маленький нюанс, который портит картину — его все еще редко используют верстальщики. Спецификация Grid есть, браузеры поддерживают, а реальных проектов мало.

Об этом расшифровка доклада Сергея Попова на Frontend Conf: про спецификацию, про то, почему верстальщики боятся Grid и как решиться применять сетку в своих проектах, чтобы «Make your website great again!». Читать дальше →
CSS Grid Layout. Быстрый старт

Вступление Всем привет. Февраль-Март 2017 года запомнились для многих, кто работает с HTML и CSS тем, что большинство...

Подробнее
MoscowCSS

6 апреля на Мансарде RAMBLER&Co состоится MoscowcCSS митап. Мы услышим 3 доклада: Недокументированные приемы CSS....

Подробнее
[Перевод] Учим CSS Grid за 5 минут

Быстро познакомимся с будущим макетов веб-сайтов. Grid макеты имеют основополагающее значение для дизайна веб-сайтов, а...

Подробнее
[Перевод] CSS Grid — швейцарский армейский нож для макетов сайтов и приложений

В течение последних двух месяцев я углубился в изучение CSS Grid. В этой заметке я хочу поделиться своими основными...

Подробнее
[Из песочницы] Создание несимметричной сетки с помощью Grid Layout

На данный момент, по данным Can I Use, 84% браузеров поддерживает Grid Layout. С каждым месяцем это число растет. А...

Подробнее
Видеоурок по применению CSS Grid

Привет! Тема CSS Grid уже долгое время не даёт покоя frontend сообществу. В этом видео мы решили перейти от теории к...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms/

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями