【コピペOK】floatとFlexboxのCSSレイアウト比較例3選

みなさん、こんにちわ！ ジャングルオーシャンのラファエロです！！ つい最近、Webデザイン初心者の友人からこんなことを言われました。 「CSSでレイアウトしたいんだけど、ネットで調べてみるとfloatとかFlexboxとか出てきて意味わかんない(T ^ T)」 確かにCSSでのレイアウト方法を検索してみるとfloatを使った方法とFlexboxを使った方法が混在していて、Webデザイン初心者には分かりづらいですよね(^^;) ラファエロは断然Flexboxを使った方法をおすすめしていますが、実際のところfloatとFlexboxのどっちが簡単なのかサンプルコードを用意したので比較みましょう！ <nav> <ul> <li><a href="＃">Top</a></li> <li><a href="about/">About</a></li> <li><a href="service/">S

[hotate0]

css描き始めた頃はflexboxなかったのでfloat実装してたけど、今やfloat使うことはほとんどないよなぁ。教える立場としてもflexboxの方が教えやすくていい。

[su_zu_ki_1010]

“flexbox”次の案件で使えるかな？ブックマークしておく。

[peketamin]

flexはflex-grow, flex-shrink, flex-basisのショートハンド