Предотвратить расширение контента сеткиCSS

Разбираемся в CSS
Anonymous
Предотвратить расширение контента сетки

Сообщение Anonymous »

tl; dr: < /strong> есть ли что-то вроде таблицы: фиксированный < /code> для сетки CSS? Контейнер получает ширину и высоту 100% каждая.

Код: Выделить всё

.year-grid {
width: 100%;
height: 100%;

display: grid;
grid-template: repeat(3, 1fr) / repeat(4, 1fr);
}

.month-grid {
display: grid;
grid-template: repeat(6, 1fr) / repeat(7, 1fr);
}
Вот рабочий пример: https://codepen.io/loilo/full/ryxlpo/
для простоты каждый месяц в этом руче (= однодневные ячейки) довольно конденсированы, так как на странице их есть несколько сотен. И как только метки номеров дня становятся слишком большими (не стесняйтесь поиграть с размером шрифта в ручке, используя кнопки слева в верхней части левого), сетка просто расти в размерах и превышает размер тела страницы. Связанные с сетью свойства CSS, которые соответствовали бы этой потребности. Однако этот вопрос больше об общих знаниях по теме, чем о решении конкретного примера.

Подробнее здесь: https://stackoverflow.com/questions/433 ... grid-items

Вернуться в «CSS»