このような div/カードを配置するにはどうすればよいですか?

Question

写真のような div を配置するのに苦労しています。

リーリー

このようなことを試してみましたが、CSSを使用してスタイルを設定したり配置したりするのが困難です。

単一の div は、最初の 2 つのカード/div にちなんで名前が付けられます。 2 番目の div は、2 番目のカード/div ダウンという名前が付けられます。

Answer 1

CSS グリッドは、このようなタイプのレイアウトに役立ちます。以下のコードを調べて、モデルに基づいてボックスをレイアウトする方法を確認してください。

MDN の グリッド テンプレート領域 に関する次のセクションを必ずよく読んでください: グリッド セルを空白のままにしてください

リーリー リーリー

リソース: CSS グリッドの完全ガイド