twitter埋め込みしたらbootstrap.cssで下切れる

2015年10月12日更新 view: 117 view
http://cdn-ak.f.st-hatena.com/images/fotolife/z/zariganitosh/20130628/20130628085054.png

twitterを埋め込みしたときに、下が少し消える場合の対処方法

bootstrap.cssを使って、スマホからみた時だけ何故か下線が消えてしまう・・・
ではどのように対応するかというと

・スマホでみた時のみCSSを変更

で対応する。

スポンサードリンク
@media (max-width: 992px) {

.col-md-9 {

position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 0px !important;
margin-left: 15px !important;

}


}

ようは 992px 未満の .col-md-9 の css を変更しちゃうよ
ってことですね。

twitter の 返信を埋め込んだ時のCSS

返信を埋め込んだ時のcssがうまく表示されない。
じゃあどうすりゃいいのよ?
ということでCSS書いておきます。

blockquote.twitter-tweet {
display: inline-block;
font-family: "Helvetica Neue", Roboto, "Segoe UI", Calibri, sans-serif;
font-size: 12px;
font-weight: bold;
line-height: 16px;
border-color: #eee #ddd #bbb;
border-radius: 5px;
border-style: solid;
border-width: 1px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
margin: 10px 5px;
padding: 15px;
max-width: 468px;
}

blockquote.twitter-tweet p {
font-size: 16px;
font-weight: normal;
line-height: 20px;
}

blockquote.twitter-tweet a {
color: inherit;
font-weight: normal;
text-decoration: none;
outline: 0 none;
}

blockquote.twitter-tweet a:hover,
blockquote.twitter-tweet a:focus {
text-decoration: underline;
}
スポンサードリンク

関連記事

関連カテゴリ

まろにーちゃん

一位を目指して日々がんばっています!

ピックアップ

パソコン・ソフトウェア ランキング

9月21日 ( 木 ) にアクセスが多かった記事はこちら!