Я не понимаю этот код для строк в медиа (CSS) ⇐ Html

[Anonymous]

Привет, я не понимаю этот код для карт < /p>
Мой контейнер для карт - это, прежде чем Heigh of Container на 100%, а ширина - Auto < /p>
.container-cards {
display: grid;
grid-template-columns: repeat(3, auto);
grid-template-rows: repeat(2, 600px);

gap: 1em;

}
< /code>
Но когда я попытался ввести медиа -код, он не работает для всех карт, Hegiht не то же самое, как с самого начала. Если я вместо этого напишу для строк, эта сетка-тарелки-строки: повторить (5, 600px) высота будет исправлена. Я не понимаю, почему этот код не работает для строк, установленных на Auto. < /P>
@media (max-width: 767px) {
/* Small screens: 1 card in a row */
.container-cards {

grid-template-rows: auto;
grid-template-columns: 1fr;
}
}


Подробнее здесь: https://stackoverflow.com/questions/765 ... -media-css