Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8582

画面に収まりきらないコンテンツを折り返し表示する方法

$
0
0

商品一覧表示を実装中、
親要素に display: flex; をかけただけだと
スクリーンショット 2020-09-04 12.44.31.png

このように一列に横並びになってしまうためブラウザからはみ出てしまう。
そこで同じ親要素に、flex-wrap: wrap;(画面幅に収まらない場合は折り返すcss)をかけると
スクリーンショット 2020-09-04 12.48.32.png
のように折り返し処理をしてくれる。

コード


Viewing all articles
Browse latest Browse all 8582

Trending Articles