Html: Плиточная галерея

CSS: Основы Flex 10 сообщений
Обновлено: 13 янв., 10:12
627
Студентов
88%
Завершения

В этом упражнении вам необходимо сделать плиточную галерею используя только возможности Flex. Зачастую такой вид галереи создаётся при помощи JavaScript, так как необходимо подстраивать элементы друг под другом с одинаковыми отступами вне зависимости от высоты элементов в строке.

Конечным результатом выполнения упражнения станет следующий вид галереи:

Финальный вид плиточной галереи

Ваша задача: задать стили для блока gallery и элементов gallery-item.

Подсказки

  1. Подумайте, по какой именно оси должны отображаться элементы внутри блока gallery.
  2. Вам понадобится свойство order.
  3. Используйте псевдокласс nth-child.
  4. Не забудьте про перенос элементов.

Для полного доступа к испытанию нужен базовый план

Базовый план откроет полный доступ ко всем курсам, упражнениям и урокам Хекслета, проектам и пожизненный доступ к теории пройденных уроков. Подписку можно отменить в любой момент.

Получить доступ
900
упражнений
2000+
часов теории
3200
тестов