コードを含む codpen リンクは次のとおりです。 https://codepen.io/gregelious/pen/zYmlGex

これは、3 つのカテゴリ (div) が 3 つの個別のボックスとして含まれるレストランのメニューです。

(詳細な手順はこちら: https://github.com/jhu-ep-coursera/fullstack-course4/blob/master/assignments/assignment2/Assignment-2.md)

手順は次のとおりです:

• 幅 >= 992 の場合、各ボックスは画面幅の 3 分の 1 を占める必要があります
• 幅が 768 ～ 991 の場合、最初の 2 つのボックスは画面幅の 50% を占め、3 番目のボックスは次の線幅の 100% を占める必要があります。
幅が 768 未満の場合、各ボックスは幅の 100% を占めるため、3 つの別々の行が必要です
• < 768 时，每个框占据宽度的 100%，因此应该有 3 条单独的行

「first」、「next」、「thirth」の div ID を指定しました。これが私の CSS です:

リーリー

ブラウザ ウィンドウのサイズを変更しても、div のサイズは変更されず、修正方法がわかりません。 Coursera コースからこの課題を受け取り、メディア クエリやその他の関連内容に関するビデオをもう一度見ましたが、進歩はありませんでした。