Масштабирование контейнера изображения CSS со 100% высотой

Я использую изображение, которое должно автоматически масштабироваться внутри блока div, высота которого определяется корневым блоком div. Масштабирование выполняется во всех основных браузерах, для самого изображения используется height: 100% . Но кажется, что в некоторых браузерах контейнер изображения не адаптирует свою ширину в соответствии с его содержимым (изображением).

Проверьте сами живую демонстрацию .

В этой демонстрации используется изображение контейнер с синим фоном.

Ожидаемое поведение: Этот фон не должен отображаться, поскольку ширина и высота контейнера должны быть такими же, как его содержимое (изображение).

Фактическое поведение :

• В Chrome 11, Safari 5 и IE9 поведение соответствует ожиданиям.

_{(источник: imgh.us )}

• В Firefox 3.6 / 4.0 и Opera 11 поведение не такое, как ожидалось. : отображается синий фон.

_{(источник: imgh.us )}

В чем основная причина такой сильной разницы между основными браузерами?