このブログに付けていたFacebookの「いいね！」ボタンが、いつの間にか上記の画像のようにずれて表示されていたので修正してみました。
ずれてしまった原因
原因としては以下の2点が考えられます。
- テンプレートのコードを変更したときにミスった
- いいね！ボタンのクラス名か、その内部の名前が変更された
1に関しては論外ですが、2に関してはちょっと問題がありそうです。
少し調べてみても他の方で同じ症状に悩まされている方はいなそうなので単純に自分のミスだと思われます。
ずれ対策
一応ずれ対策用のCSSを記しておきます。
.fb_iframe_widget{vertical-align:top;margin-top:-3px;}このコードが効くのは、いいね！ボタンがデフォルトの状態でdisplayがinline-blockの場合のみだと思います。
そもそもfloatで整列させている場合にはズレることはないと思います。
他の皆さんは遥か昔に対策されていると思いますが一応覚書しておきます。