CSSコーディングレシピ集（レイアウト編） | Hypertext Candy

この記事では、CSS を学び始めの方を対象に、よくあるレイアウトのコーディング方法を紹介します。 CSS の基本的な文法や Flexbox などの書き方そのものについては、この記事では扱いません。あくまでそれらの基礎を組み合わせた、コーディングパターンについて書いていきます。レイアウトの基礎については、記事の最後にいくつか載せたリンクを参考になると思います。 以下のシリーズ記事のレイアウト編です。 CSSコーディングレシピ集（コンポーネント編） CSSコーディングレシピ集（フォーム編） 中央寄せ まずは中央寄せのテクニックです。CSSを学び始めた方は誰しも挑戦しますよね。 左右中央寄せ 左右の中央寄せは、基本的に2パターンです。 中央寄せにしたい要素の display プロパティが、 block の場合 → その要素の左右のマージンに auto inline または inline-bloc