ホームページのコーディングをしているとちょくちょく出てくるのが「上下左右の中央寄せ問題」
左右中央は簡単ですが、上下の中央寄せはわりとめんどう。
左右中央もfloatを使う必要があると、一気にめんどくさくなる。

最近は「display: flex」に対応したブラウザが増えているので、これを使うと簡単に対応することができます。

.hoge {
  display: flex;
  align-items: center;/*上下中央寄せ*/
  justify-content: center;/*左右中央寄せ*/
}

このクラスを、divやulやdlなんかに入れて使います。

• « 前へ
• 一覧に戻る
• 次へ »