Центрирование картинки произвольного размера в блоке фиксированного размера

[maxmaster]

На одном из форумов видел решение для центровки элемента по вертикали относительно родителя. Я доработал этот пример под полное центрирование картинки

Задача: есть картинка заранее неизвестного размера, есть блок фиксированного размера, внутри которой эта картинка должна быть размещена по центру.

Решение: обязательно наличие еще одного вспомогательного элемента и главный блок фиксированного размера

#Image{
    width: 830px;
    height: 750px;
    line-height: 750px;//Значение равное высоте блока

}

#Image div{
    width: inherit;//наследуем ширину родителя, относительно которой мы будем выравнивать img
    display: inline-block;//указываем что div - встраиваемый элемент. По умолчанию так себя ведет тэг img
    vertical-align: middle;//выравниваем вспомогательный блок относительно родителя по вертикали
}

#Image div img{
    display: block;
    margin: auto;// выравниваем картинку по горизонтали относительно вспомогательного блока, можно было бы 0 auto, но результат одинаков
}

<div id="Image">
<div>
<img src="ваша_картинка.jpg">
</div>
</div>

[Modestes]

в IE9 не работает

[Szen]

в IE9 не работает

IE не разрешает задавать inline и inline-block для блочных элементов. Зато для строчных это канает.

Лечится очень просто:

#Image{
    width: 830px;
    height: 750px;
    line-height: 750px;//Значение равное высоте блока

}

#Image span{
    width: inherit;//наследуем ширину родителя, относительно которой мы будем выравнивать img
    display: inline-block;//указываем что span - встраиваемый элемент. По умолчанию так себя ведет тэг img
    vertical-align: middle;//выравниваем вспомогательный блок относительно родителя по вертикали
}

#Image span img{
    display: block;
    margin: auto;// выравниваем картинку по горизонтали относительно вспомогательного блока, можно было бы 0 auto, но результат одинаков
}

<div id="Image">
<span>
<img src="ваша_картинка.jpg">
</span>
</div>

[lexxcode]

IE не разрешает задавать inline и inline-block для блочных элементов.

С чего вы это взяли??

http://jsfiddle.net/alexriz/fBnSk/

[USF]

IE не разрешает задавать inline и inline-block для блочных элементов.