Androidスマホのブラウザで、画像の表示がなんだかおかしい

お仕事で、とあるホームページを手直ししていた時のこと・・・


ホームページを作る時は、色んな端末やブラウザで表示の確認を毎回行っております。

そこで、Androidスマホの標準ブラウザって言うの?
青い地球っぽいアイコンのブラウザアプリで、画像の表示がなんだか、おかしい。



画像の表示位置がずれて、縦に間延びした様に表示されてしまっているのです。
時には拡大されていることも。


あとは、AndroidのChromeで見てみると、画像がそもそも表示されてなかったり。


ブラウザの設定で、自動調整等のオプションはオフにしているにも関わらず・・・
念の為にキャッシュのクリアとか再起動とかやってみても症状は改善されず。


ほっとくワケにはいかないので色々弄ってみた結果


画像のCSSで、max-heightを指定したら直りました。
(指定する値は画像の高さと同じでOKです)


Chromeの方はそれでも直らなかったんですけど、min-heightを指定したら直ったので、これで解決したってことでよかったのかな?
(値はやっぱり画像の高さで)


うーん、なんだ。
色んな端末で確認しないといけないのは、めんどくさいね。