JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <img src="https://via.placeholder.com/246x354"/>
  <img src="https://via.placeholder.com/164x236"/>
  <img src="https://via.placeholder.com/164x236"/>
</div>

<!-- EXPECTED without set height-->
<div class="container">
  <img src="https://via.placeholder.com/246x354"/>
  <img src="https://via.placeholder.com/164x236" style="height: 169px"/>
  <img src="https://via.placeholder.com/164x236"  style="height: 169px"/>
</div>

SCSS

.container {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, min-content);
  
  img:nth-child(1) {
    grid-row: span 2;
  }
  
  margin-bottom: 24px;
}