[Перевод] Нативный Masonry Layout в CSS Grid Level 3

Скрипты и советы | 8 ноября 2020

Уроки CSS на Хабрахабре, habrahabr.ru, Разработка веб-сайтов, CSS, css, css grid, masonry,

Недавно был опубликован черновик спецификации CSS Grid 3 уровня, в котором содержится описание способа создания Masonry-раскладки с помощью чистого CSS. В этой статье Rachel Andrew объясняет данную спецификацию с примерами, которые вы можете воспроизвести в браузере Firefox Nightly. И хотя данный функционал пока что нельзя использовать в реальных проектах, ваш отзыв может помочь убедиться, что текущая реализация соответствует или не соответствует требованиям разработчиков к этому типу раскладки.

Читать далее
[Перевод] Понимание CSS Grid: Создание Grid-контейнера

Перевод «Understanding CSS Grid: Creating A Grid Container» Рейчел Эндрю Хотя технология CSS Grid стала поддерживаться...

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

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

Подробнее
[Перевод] Понимание CSS Grid (3 часть): Grid-области

Приветствую! Представляю вашему вниманию перевод статьи «Understanding CSS Grid: Grid Template Areas» автора Rachel...

Подробнее
CSS Grid Layout. Быстрый старт

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

Подробнее
[Перевод] Понимание CSS Grid (2 часть): Grid-линии

Перевод Understanding CSS Grid: Grid Lines» Rachel Andrew В первой статье из серии "Понимание CSS Grid" мы рассмотрели,...

Подробнее
[Перевод] Что происходит при создании контейнера Flexbox?

Это перевод статьи Rachel Andrew, являющейся одним из разработчиков спецификаций CSS. В короткой серии статей я...

Подробнее

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

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

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

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

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

https://t.me/tcsecms/

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