css - img { 最大高さ: 100%; img が境界を超えます

Question

これはChromeのバグですか？

HTML は次のとおりです。

<div><img src="test.png"></div>

CSS は次のとおりです。

* { box-sizing: border-box; }
div { height: 200px; padding: 75px 0 60px; }
img { max-height: 100%; }

期待される結果: のimg高さは 65px である必要があります。

Mac OS (v. 10.6.8)での Chrome (v. 27.0.1453.116) の結果img: の高さは 135px で、親divのパディングに「ブリード」します。の を に変更するとpadding、奇妙なことに正しくレンダリングされます。div50px 0

codepenでこれを試してください: http://codepen.io/anon/pen/jhbKz

スクリーンショット:

最初のブロックはpaddingです50px 0。2 番目のブロックには がpaddingあり75px 0 60pxます。

Firefox (正しい結果)

クロム（違う？）