Задать вопрос
@mumus

Умное количество элементов в сетке GRID?

Здравствуйте, подскажите, пожалуйста, никак не соображу.
Вот есть родительский резиновый элемент с display:grid;

Возможно ли и что нужно написать, чтобы сетка вела себя следующим образом:
1. Если внутри лежит 1 элемент, то он на всю ширину
2. Если внутри лежит 2 элемента то они пополам
3. Если внутри лежат 3 и более элементов, то они по 33.3333% процента, чтобы в ряду было по 3 элемента и затем с новой строки.

Спасибо.
  • Вопрос задан
  • 110 просмотров
Подписаться 1 Средний Комментировать
Решения вопроса 1
alsolovyev
@alsolovyev
¯\_(ツ)_/¯ Enjoy life, Eat well & Laugh often
Так?
.parent {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(calc(100% / 3 - 10px), 1fr));
  gap: 10px; 
}

Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы