Chrome で高さを小さくすると img タグのアスペクト比が崩れる

本日の Chrome の css おかしいシリーズ

img タグでは 幅と高さのどちらかだけを指定していると アスペクト比が変わらないようにして全体がリサイズされます

ではこちらをご覧ください

サンプル

このページでは img タグに height:50% を指定しているだけです
ウィンドウのサイズを変えても画像の高さは画面全体の半分のはずです

大きくするときは アスペクト比が維持されて大きくなるのですが 小さくするとアスペクト比が維持されず縮むので潰れています




Firefox ではこの現象は起きてません
これは確実にバグですよね


この例ではウィンドウサイズを変更しましたけど ウィンドウじゃなくても親要素を縦方向に縮めるだけで起きます

横方向リサイズや縦に引き延ばすと本来のサイズになるんですが アニメーションなどで自動で縮むときは明らかにこのおかしな状態で残っているのでちょっと気持ち悪いです