古いブラウザがなくなってきたことでどんどん簡単に記述できるようになってきたclearfix（flortを解除する記述）ですが、新しいスタイルによってさらに短く書けるようになるようです。
display に追加された flow-root を使うことで、flortを解除できるようです。
使い方は簡単で、親要素に
display:flow-root;
と書くだけです。
ただしまだ対応ブラウザが少ないようで、2019年1月現在、IE、Edge、Safari、iOSで対応していません。
今後対応していくブラウザが増えていけば、親要素に overflow: hidden; と書いていたところをまるまる置き換えられるくらい簡単な方法ですので、これからの対応に期待ですね。
コメントする