CSS Вертикальное выравнивание изображения внутри div

Question

У меня есть этот div и внутри div - это изображение, и то, что я пытаюсь сделать, - это вертикальное выравнивание изображения, которое будет центрировано посередине, и ничего, что я пытаюсь, кажется, работает ...

<div style=" height: 200px; vertical-align: middle; width: 225px;"> 
<img width="225" src="upload/home5.jpg"> 
</div> 

Я также попытался это добавление vertical-align:middle; к изображению, а также, но это не сработало.

У кого-нибудь есть идеи?

Я забыл упомянуть, что я использую некоторые JQuery код, и это делает мой DIV position:absolute;

это то, что мой DIV выглядит после того, как он проходит через Jquery

<div style="position: absolute; top: 0px; left: 0px; display: block; z-index: 4; opacity: 1; width: 225px; height: 200px;">

и здесь css для изображения

img {  
    background-color: #eee; 
    margin: auto; 
    display:block; 
} 

Answer 1

Вы можете использовать дисплей: table-cell для этого на div. Это позволяет работать с атрибутом vertical-align. Нет поддержки для IE7. Если вам нужно, что есть другие решения.

http://jsfiddle.net/5HzpM/

div { border: 1px solid gray; display: table-cell; } 
img { vertical-align:middle; }