Как сделать два ряда столбцов с одинаковой высотой в сетке? ⇐ CSS

[Anonymous]

Я использую CSS Grid для создания строк с двумя столбцами в каждом. Я хочу, чтобы столбцы имели одинаковую высоту-та же высота, что и фотографии-но сетки-автозащиты: 1FR; , похоже, не работает. Что я делаю не так?

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

    .storyfeed {
width: 100%;
z-index: 5;
margin-top: 20px;
display: grid;
grid-auto-columns: minmax(0, 1fr);
grid-auto-rows: 1fr;
grid-auto-flow: column;
}
.col {
}

.story {
width: 100%;
display: grid;
grid-template-columns: 1fr 2fr;
grid-auto-rows: 1fr;
z-index: 5;
}

.story-img {

}

.story-squib {
padding: 10px 20px;
background-color: #eae9e1;
overflow: hidden;
}

.story-head {
font-family: 'Montserrat';
color: #4a5831;
margin-bottom: 10px;
font-weight: bold;
font-size: 2rem;
}

.story-body, .story-date {
font-family: 'Montserrat';
color: #96968a;
font-weight: 600;
font-size: 1rem;
}

.story-date {
margin-bottom: 10px;
}< /code>

[url=https://www.post-gazette.com/sports/jason-mackey/2025/04/07/nfl-free-agency-aaron-rodgers-pat-mcafee-show/stories/202504060108]



[img]//newsinteractive.post-gazette.com/.test/img/bar.jpg[/img]

Iconic bars
April 20, 2025
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.


[/url]

[url=https://www.post-gazette.com/sports/paul-zeise/2025/04/07/nil-house-ncaa-settlement-pitt/stories/202504030112]



[img]//newsinteractive.post-gazette.com/.test/img/arnold-palmer-drink.jpg[/img]

Arnold Palmer and the Arnold Palmer
April 18, 2025
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.


[/url]

Подробнее здесь: https://stackoverflow.com/questions/795 ... -in-a-grid