次の報告がされているが仕様だと回答されている。

https://issues.chromium.org/issues/338601202

次のようなケースを考える。

.container {
  display: grid;
  grid-template-columns: 1fr;
  width: 200px;
  height: 200px;
}

.item {
  aspect-ratio: 2 / 1;
}

次のような解釈が行われる。

• コンテナやアイテムにalign属性が指定されていないため、初期値であるnormal（stretchとほぼ等価）が適用され、アイテムは縦軸に伸縮しようとする。
• アイテムに高さと幅の指定がないため、アイテムは縦軸いっぱいに伸びる。
• 高さ（H）が決定されたので、次にアイテムのaspect-ratioが評価され、幅が高さの2倍（W = 2H）になる。
• 1frはminmax(auto, 1fr)に展開される。
• アイテムの大きさはaspect-ratioで固定されているので、minmax(W, 1fr)相当になる。

Wは、コンテナの大きさを超えているのでオーバーフローが起きる。

回避策

• 1frではなく、minmax(0, 1fr)を利用する
• アイテムにmin-width:0を指定する。
• アイテムやコンテナにalign系のプロパティを指定する。