3. Flexbox と CSS Grid を使って Web デザインをレベルアップ：実践的なチュートリアル
   grid-auto-rows: minmax(auto, 1fr) を使用するこれは、最も簡単で一般的な方法です。grid-auto-rows: minmax(auto, 1fr) を親要素に設定すると、各行の高さは自動的にコンテンツに合わせて調整されますが、少なくとも 1 つのフレックス単位 (1fr) の高さになります。これにより、すべての行が同じ高さになり、コンテンツが少ない行は自動的に拡張されます。
4. グリッドレイアウトにおけるコンテンツの制御：CSS Grid を用いたアプローチ
   CSS Grid レイアウトは、Web ページの要素を柔軟かつ効率的に配置するための強力なツールですが、コンテンツがグリッドアイテムの境界を越えて拡張してしまうことがあります。これは、デザインを崩したり、ユーザーエクスペリエンスを損なったりする可能性があります。
5. Flexboxで最後の行をグリッドに配置する方法
   この解説では、Flexboxを使用して最後の行をグリッドに配置する方法について説明します。Flexboxを使用して最後の行をグリッドに配置するには、以下の手順に従います。親要素に display: flex プロパティを設定します。子要素に flex-grow: 1 プロパティを設定します。