読者です 読者をやめる 読者になる 読者になる

KSKV

Khong Say Khong Ve. ベトナムの意味なし画像集

はてなブログのブログカードの幅を100%にする

やり方

ブログを引用した場合、表示されるカードがなんか狭いなって思ってたのでソースを見てみると

<iframe src="http://example.com/" title="hogehoge" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe>

こうなっていた。横幅が500px固定で、しかも要素にstyle属性で直書きである。

bulldra.hatenablog.com

ここにもなんか載っていたが、こんな仰々しいことせずとも、デザインの stylesheet 指定で

f:id:zamad:20151019115847p:plain

.embed-card.embed-blogcard{
    max-width: 100% !important;
}

こう書き込めばよい。自分のデザイン以外ではどのように表示されるか確認していない。

スラスラわかるCSSデザインのきほん スラスラわかるきほんシリーズ

スラスラわかるCSSデザインのきほん スラスラわかるきほんシリーズ

「自分メディア」はこう作る! 大人気ブログの超戦略的運営記

「自分メディア」はこう作る! 大人気ブログの超戦略的運営記