内側のグリッドが外側のグリッドを外にしてクロムを展開しないのはなぜですか

Question

私は大文字のグリッドスタイルでネストされたグリッドレイアウトを作成しています。ネストされたグリッドには100％幅に設定された画像があり、その高さは比例して増加し、その直下の親グリッドは垂直方向に拡大します。しかし、Chromeでは、祖父母グリッドは成長しません。

私はここの状況を嘲笑しました：https://codepen.io/anon/pen/vpEVZj?editors=1100

、最初.single-gridディスプレイ罰金が、2番目.outer-gridにはありません。

これはChromeのバグですか、何か不足していますか？

編集：今日、デモも私のアプリケーションもこの問題を示していません。多分それはちょうどうんざりの問題です。

Answer 1

わからない理由が何であるかが、あなたはgrid-template-columns: auto1frに変更することで、Chromeで期待される動作を取得することができます：

.outer-grid { 
    display: grid; 
    grid-template-columns: 1fr; 
    /* ... */ 
}