こんにちは、フロントエンドエンジニアのあつこです。 先日システム部の先輩に「2カラムのデザインがなんで実装できるのかよくわからない(´・ω・)」と言われたので、 2カラムのレイアウトを例にCSSの定番テクニック「clearfix」について簡単に解説してみたいと思います。 clearfixってなに? 例としてベタな2カラムのレイアウトを用意しました。 ベタですね。 (MacのChromeエクステンションでキャプチャとったらスクロールバーが映り込んでた(´・ω:;.:...) ちなみに、大きさはこんな感じ HTML <header>header</header> <div class="wrap"> <aside class="sideCol">sideCol</aside> <article class="mainCol">mainCol</article> </div> <footer>f