エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
IE11でflex-basisの値にbox-sizing: border-boxが効かないバグ
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
IE11でflex-basisの値にbox-sizing: border-boxが効かないバグ
前回の記事に続き、IE11でのflexbox関連のバグについてのメモです。たくさんあるflexbox関連のバグ です... 前回の記事に続き、IE11でのflexbox関連のバグについてのメモです。たくさんあるflexbox関連のバグ ですが、自分なりに1つ1つ整理していこうと思います。 今回はbox-sizing: border-box;関連のflexboxのバグです。ぱっと見では気付きにくい可能性があるので注意が必要なバグです。 バグの詳細 IE11ではbox-sizing: border-box;が指定されていても、flex-basisに指定した値がbox-sizing: content-box;をベースに計算されてしまいます。そのため、flexアイテムにborderやpaddingが指定されていると想定通りのレイアウトになりません。 対処法1 当該のflexアイテムにmax-widthを指定する。 flex: 1 1 75%; max-width: 75%; padding: 0 4rem 0 0; 対