中途半端を極める

web関連で役に立ちそうなものを紹介いたします

WEBサービス

FacebookのLike Boxなどのウィジェットを簡単にレスポンシブ対応をする方法

投稿日:

最近レスポンシブ対応のサイトが増えてきました。
しかしFacebookのLike Boxなどはタグを取得する時に横幅を指定して取得します。
どうやってレスポンシブに対応するんだろう?そう思って調べたら対応できるようにするcssを発見しました。

このCSSを入れるとFacebookのウィジェット関連は全てレスポンシブに対応する。

fbcomments,
.fb_iframe_widget,
.fb_iframe_widget[style],
.fb_iframe_widget iframe[style],
.fbcomments iframe[style],
.fb_iframe_widget span{
width: 100%! important;
}

もし部分的にレスポンシブ対応したくない箇所がある場合は、適当なdivで括ってあげて、うまくcssを調整すればよいかと思われます。(そんなことめったなことが無い限り無いとは思いますが…)

-WEBサービス

執筆者:


comment

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

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

関連記事

完全合法!ネットでマンガ閲覧が無料で読めるサイトを紹介(絶版マンガ図書館)

久しぶりの更新となります。今回はネット上でマンガが見れるサイトがあったので紹介いたします。 権利・法律上大丈夫なのか?という疑問がありましたが、運営元である「株式会社Jコミ」は漫画家の赤松健さん(代表 …

【メトロイド オモロイド】有志の人たちがメトロイドIIがリメイク!PCでメトロイドIIができるようです。【AM2R】

ゴールデンウィークも近いことですので、少し楽しめるものを紹介したいと思います。 今日で発売から25年を迎えた任天堂の携帯型ゲーム機「ゲームボーイ」。その中でも人気のゲーム「メトロイドII(Metroi …

【ハッキングされた?】何もサイトを変更していないのに「wa-track.com」にリダイレクトされてしまう。

twitterなどでもちょっと話題になっていたようですが、何もサイトを変更していないのに、別ページにリダイレクトされるような現象があったようです。(実際に自分も見ました。) ハッキングされた?など不安 …

no image

【blogger設定その2】title部分を逆にする設定

Bloggerのデフォルトテンプレートのままでは「ブログタイトル:記事のタイトル」となっています。 そのままではtwitterで記事を拡散する時に常にブログ名が頭にきてしまい、何の事について書いてある …

メールアドレスが存在しているか確認するウェブサイト「メールアドレス存在・生存・死活確認ツール」

メールを送っても、返信が数日無かったりすると不安になったりすることがありませんか? そういう時は今回紹介するウェブサイトで簡易的ではありますがメールアドレスが存在しているか確認することができます。