スタンダード:実技問題(HTML5の変換、HTMLの作成、CSSの読込と作成、画像の表示)
複数のdiv要素を横並びに配置する場合、floatプロパティを用いる方法とdisplay: flexを用いる方法の違いに関する説明として最も適切なものはどれか。
- Aflexboxは古いブラウザとの互換性のために開発された技術であり、floatより後方互換性が高い
- ✓floatを用いた場合、親要素の高さが子要素の高さに自動で追従しないためclearfixなどの対処が必要になるが、flexboxではそのような対処なしに親要素の高さが揃う
- Cfloatとflexboxはどちらも子要素の縦方向の中央揃えを自動で行う点で同じ機能を持つ
- Dfloatを指定した要素は常に画面幅いっぱいに広がるが、flexboxを指定した要素は常に等分割される
解説
floatは要素を浮動化させるため、親要素が子要素の高さを内包しない「高さ崩れ」が発生しやすく、clearfixなどの対処が一般的に必要となる。一方flexboxではdisplay: flexを指定するだけで親要素が子要素の高さを正しく内包する。
根拠シラバス「CSSの読込と作成」レイアウト手法