CSS图像的容器缩放,高度为100%

Question

我正在使用一个必须在div中自动缩放的图像,其高度由根div定义.在所有主流浏览器中,缩放都很好,使用height: 100%图像本身.但似乎在某些浏览器中,图像容器不会根据其内容(图像)调整其宽度.

自己检查现场演示.

此演示使用具有蓝色背景的图像容器.

预期行为:此背景不应显示,因为容器宽度和高度应与其内容(图像)相同.

实际行为:

• 在Chrome 11,Safari 5和IE9上,行为符合预期.

• 在Firefox 3.6/4.0和Opera 11上,行为不符合预期:显示蓝色背景.

主要浏览器之间这种强烈差异的根本原因是什么？

Answer 1

对于 Firefox，这看起来像是一个错误。我提交了https://bugzilla.mozilla.org/show_bug.cgi?id=653739

除非您确实需要它，否则您可以通过删除来解决此问题overflow:hidden。