気に入った記事をブックマーク
- 気に入った記事を保存できます
保存した記事の一覧は、はてなブックマークで確認・編集ができます
- 記事を読んだ感想やメモを書き残せます
- 非公開でブックマークすることもできます
エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
1user
がブックマーク
0
0
【CSS Tips】Flexboxの子要素が縮む・スクロールが効かない問題をflex-shrinkで解決する - Qiita
1 user
qiita.com/kabechiyo13
qiita.com/kabechiyo13
記事へのコメント0件
- 注目コメント
- 新着コメント
新着コメントはまだありません。
このエントリーにコメントしてみましょう。
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
いまの話題をアプリでチェック！
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
【CSS Tips】Flexboxの子要素が縮む・スクロールが効かない問題をflex-shrinkで解決する - Qiita
結論 親要素にdisplay: flexを指定してはみ出し部分をスクロールさせたいのにoverflow: scroll;が効かな... 結論 親要素にdisplay: flexを指定してはみ出し部分をスクロールさせたいのにoverflow: scroll;が効かない時や、子要素が縮んでしまった時の解決方法です。 解決方法：縮んでほしくない要素にflex-shrink: 0;を指定する 解説 display: flexは要素を横並びにしたい時にとても便利なプロパティです。 親要素にこのプロパティを指定すると、子要素が横並びになります。 このflexboxを使うと、親要素のサイズに対して子要素のサイズが大きくて入りきらない時に、子要素が縮んでしまうことがあります。 例えばこんな感じです。🔽 See the Pen Untitled by kabechiyo_shunkaaizawa (@kabechiyo) on CodePen. 1つ目のタブリストは、はみ出した部分がスクロールするようにoverflow-x: scroll
qiita.com
qiita.com
qiita.com/kabechiyo13
qiita.com/kabechiyo13
news.ntv.co.jp
anond.hatelabo.jp
posfie.com
www.asahi.com
anond.hatelabo.jp
posfie.com
zenn.dev/flinters_blog
av.watch.impress.co.jp
labo.hatenastaff.com
togetter.com
pc.watch.impress.co.jp
levtech.jp
inside.pixiv.blog
studyhacker.net
foneslife.com
