CSSでMovable Typeをスマートフォンに対応させる その4 "画像の表示サイズ"
スマートフォン対応させた場合、画像の表示サイズが問題になります。いつも同じサイズで方向も同じであればよいのですが、縦・横混在の場合はなかなか面倒ですが、私のサイトでは次のcssで対応しています。
PC版では幅240px、高さ180pxで表示された画像がスマートフォン版では、冒頭のスクリーンショットのように表示されます。
幅のみを12emで指定し、高さはautoにして表示させています。
p.photo_left img,
p.photo_right img {
width: 12em;
height: auto;
}
コメント