Центр изображения по вертикали

Question

Я разработал веб-сайт для галереи изображений. В настоящее время каждое изображение выровнено вверху, я желаю, чтобы изображение находилось в центре DIV.

Вот мой код:

.carousel .item { 
    height: 900px; 
    background-color: #777; 
} 
.carousel-inner > .item > img { 
    top:5%; 
    display: block; 
    margin-left: auto; 
    margin-right: auto 
} 

Вот мой сайт ссылку тоже увидеть его в действии: http://www.canninginc.co.nz/canluciddream/screenshots.html

Последнее изображение является хорошим примером. Это небольшое изображение, и я желаю, чтобы оно было размещено вертикально по центру.

Answer 1

Попробуйте CSS

.carousel .item { 
     position:relative; 
     height: 900px; 
     background-color: #777; 
} 
.carousel-inner > .item > img { 
     display: block; 
     margin: auto; 
     position: absolute; 
     top: 0; left: 0; bottom: 0; right: 0; 
} 

и попробовать это, очень полезно Absolute Horizontal And Vertical Centering In CSS