「Twenty Twelve」でFacebookやTwitterのiframeにマージンが設定されること

Facebookボタンをサイトに表示すると、ボタンの下に余白ができてしまうので原因を探ると、WordPressのTwenty Twelveテーマでは、iframeに対してmargin-bottomが設定されていて、それが原因でFacebookボタンの下に余白ができることが判明。

そこで余白を無くすには、margin-bottomを0にすると無くなります。

親テーマを編集せずに子テーマだけでスタイル使用を設定しなおしたいときは、スタイル設定でmargin-bottom:0を設定して!importanを追加して優先度を高くして対処する方法もあります。

.fb-like {
  margin-bottom: 0px !important;
}

またTwitterボタンでも同じようにiframeを使っている場合は、ボタンの下に余白ができるのでFacebookボタンと同じようにmargin-bottom:0を設定します。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です