CSS で簡単に上下中央揃えを実現する
こちらの記事で紹介されている方法で、
よく中央揃えを実装します。
非常に便利なのですが、先日どうしても上手くいかず
かなりの時間悩んでしまったことがあったので、
忘れないようにメモを残しておきます。
● テキストテキスト
↑
text-indentでテキストを飛ばした背景画像
このような左右の2ブロックを中央揃えにしたのですが、
IE6でのみ中央揃えになりませんでした。
どうやらtext-indentが原因だったようで、
単純にimgタグで画像を設置したら問題なく中央揃えになりました。
他にも、並べる要素はブロック要素でなければ
ならなかったりするようです。
spanなどにdisplay:blockを指定しても上手くいかなかったので、
上記もimgタグをpタグで囲ったりしています。