miyamae https://blog.hatena.ne.jp/miyamae/ BitArts Blog https://blog.bitarts.jp/ Web HTML CSS Bootstrap3ではモバイルファーストでレスポンシブデザインに対応したので、レスポンシブ対応なサイトを作るのが非常に楽になりました。 ところでBootstrapにはMedia objectという要素があって、サムネイル画像＋テキストのリストを綺麗に表現することができます。 ところがこの要素がレスポンシブデザインに対応できていないようです。 というかMedia objectで使っている .pull-left がレスポンシブに対応しておらず、小さい画面でも無理やり回り込んでしまう。 そこで、画面サイズがsm以上の時だけ回り込みする .pull-sm-left / .pull-sm-right … 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fblog.bitarts.jp%2Fentry%2Farchives%2F004364.html" title="Bootstrap3のMedia objectをレスポンシブ対応にする - BitArts Blog" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/m/miyamae/20190924/20190924104521.png Hatena Blog https://hatena.blog 2014-02-17 12:00:00 rich https://blog.bitarts.jp/entry/archives/004364.html 1.0 100%