WEB制作の勉強を始めると、いくつかの大きなハードルが待ち受けています。そのうちのひとつにfloatがあるのではないでしょうか?今回は、floatプロパティも含めて、最近よく使われている手法で、2カラムレイアウトの実現方法をご紹介したいと思います。floatプロパティを使ったレイアウトfloatプロパティを使って2カラムのレイアウトを組む手法は、今でもオーソドックスな方法として使われ続けています。ブラウザやバージョンに依存せずに導入できる点がメリットかと思います。floatを使って組む場合のポイントは3つ。2カラムコンテンツの親要素がある場合は、overflow:hidden;を設定するとにかく、まずはこれをしっかり守ってコーディングして下さい。FlexboxレイアウトCSS3以降実装されたFlexboxですが、これまでブラウザの対応が十分ではなかったため、現場ではあまり使われていませんでした。最近ようやく全てのブラウザで対応され、現場での実装にも耐えうるものになってきたようです。比較的簡単に組み込めるため、今後注目のテクニックになるかもしれません。560px;}こちらの記事も参考にご覧下さい。擬似的tableレイアウト今は誰も使っていないと思いますが、昔はtableタグを使ってページレイアウトを組んでいました。現在では推奨されていませんが、HTML5になってからdisplayプロパティを使って要素の挙動を変える事も許容されるようになりました。これにより、display:table-cell;などの設定で、擬似的にテーブルレイアウトを組む場面も増えてきました。擬似的インラインレイアウト上記、擬似的tableレイアウトと同じ手法で、inline-blockとして並べる方法もあります。こちらの場合、html上で改行すると改行記号が余白として表示され、レイアウトが崩れる場合があります。個人的には、あまり使わないかもしれません。inline-block;}まとめ2カラムレイアウトの実現には、色々な方法があります。いずれにしても、メリット・デメリットがありますので、うまく使い分けて下さい。聞けないようなことも、懇切丁寧にご説明致します。無料体験レッスンを受けてみて下さい。詳しくはこちら・2019/2/25追記Akros東京校ではマンツーマンのPRO講座以外にも短期で学べる「短期講座」も開催しています。上記以外にも限定講座なども開校しておりますので気になる方はぜひご確認・ご受講ください。(土日祝定休)Akrosでは、受講生と一緒に成長したい仲間を募集していますWEB制作会社が作ったWEBデザイナー育成スクールAkros。