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

2013/4/24 16:22

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

↑ なんでｗ？

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

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

.fb_iframe_widget iframe { position:static !important; }

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

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

Webエンジニアやってます。最近はドットインストールの開発がお仕事です。その傍ら、個人で Meity や電車遅延なう、梅酒.in、 #グラドル自画撮り部の部室といったネットサービスを開発・運営してます。梅酒と草野球とリアル脱出ゲームが好きです。