ネットサービスとかGoogleとか豆知識とか。

Index > Facebook > FacebookのLike Boxが右に半分ズレてる場合の対処法
Facebook
2013年04月24日 16:22

FacebookのLike Boxが右に半分ズレてる場合の対処法

  • このエントリーをはてなブックマークに追加
  • ... PV
スポンサード リンク

何かFacebook側のコードで変更があったのか、ブログに設置しているLike Boxが右に半分ズレていました。

facebook-like-box-bug.jpg

↑ なんでw?

Chromeの要素の検証で原因になっているCSSの記述を探ってみると、.fb_iframe_widget iframe に指定されている { position:absolute; } を無効にすると元に戻ります。

その iframe の親要素にある span タグから iframe を外に出せば戻るのですがそれはできないので、次のような CSS の上書きで暫定対処をしました。

.fb_iframe_widget iframe { position:static !important; }

他のサイトを見てみるとズレてるサイトとズレてないサイトがあって、サイトごとのCSSの指定によって変わってるのかなと思いつつも明確な原因がわかりません。

というわけでご参考までに。