3つのコンテンツを並べる方法

Question

初めて投稿致します。

Webデザイン学校でサイト制作をしているのですが、このように３つのコンテンツを幅1000px高さ700pxに収める方法がわかりません。

flexをいくら試してもうまくいかず
どのようなflexを使えばいいのか困っています。
どうかご助力願います。

Comments

[K_3578]

学校の課題は自分でやるべきだから明確な回答は得られないとは思います、

それはそれとして、とりあえず自分がどのようにやっているかをソースコードで
表して頂ければ回答もされやすいかと。

[Lhankor_Mhy]

試したコードをご提示ください。

[dit.]

グリッドレイアウトではなくflexを使いたいということでしょうか。
他の方も指摘していますが、うまくいかないコードでもいいのでまずはご自身が試したコードを提示してください。質問は編集できます。
ヘルプ内の質問するときのヒント（https://teratail.com/help/question-tips）もご一読を。

Answer 1

補足いただけないようなので、推測でお答えします。具体的なコードがないのでふわっとした回答になりますがよろしくお願いします。

• 全体を囲う要素を準備し、幅1000px高さ700pxに指定して、さらにdisplay: flexを指定します。
• その中に2つの要素を入れます。
• 2つのうち、後の方の要素に、display: flex flex-flow: columnを指定します。
• その中にさらに2つの要素を入れてください。
• 最後にすべての要素にflex-grow: 1とすればいい感じになると思います。