Middle
Praktische Aufgabe zu CSS Grid: Der Container hat die Eigenschaft grid-template-columns mit festen 5 Spalten. Es ist notwendig, die Eigenschaft so zu überschreiben, dass die Anzahl der Spalten dynamisch (anpassungsfähig) wird
sobes.tech KI
Antwort von AI
Чтобы сделать количество колонок в CSS Grid динамическим при фиксированной ширине колонок, можно использовать функцию repeat с ключевым словом auto-fit или auto-fill и фиксированной шириной колонок через minmax.
Пример:
.container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 10px;
}
Здесь:
auto-fitавтоматически подбирает количество колонок, которое помещается в контейнер.minmax(150px, 1fr)задает минимальную ширину колонки 150px и максимальную — растягивается по доступному пространству.
Таким образом, количество колонок будет адаптироваться под ширину контейнера, сохраняя фиксированную минимальную ширину каждой колонки.