minmax()

minmax() は CSS の関数で、寸法の範囲を min 以上、 max 以下で定義し、CSS グリッドで使用する

<div class="wrapper">
  <div><img src="http://zyco.jp/topics/images/trimming.jpg" class="img-width"></div>
  <div><img src="http://zyco.jp/topics/images/crop.jpg" class="img-width">
  </div>
  <div><img src="http://zyco.jp/topics/images/grid-10.jpg" class="img-width"></div>
  <div><img src="http://zyco.jp/topics/images/position.jpg" class="img-width"></div>
  <div><img src="http://zyco.jp/topics/images/060.gif" class="img-width"></div>
  <div><img src="http://zyco.jp/topics/images/tweenmax.jpg" class="img-width"></div>
</div>
.wrapper {
  display: grid;
  grid-template-columns: minmax(90px, auto) minmax(90px, auto) minmax(90px, auto);
  grid-auto-rows: minmax(90px, auto);
  background-color: rgba(255, 255, 255, 1);
  color: #fff;
  gap: 5px;
  width: 100%;
}
.wrapper > div {
  background-color: rgba(70, 130, 180, 0.6);
  padding: 0;
}
.img-width {
  width: 100%;
}

自動生成された行の高さと幅の最小値は 90 ピクセル、最大値は auto になる。値に auto を使うと、この行のセルが内容物のサイズに応じて空間が引き伸ばされ、その高さに合わせられる。