Wyrównanie w pionie obrazu w div jednostki nadrzędnej za pomocą css

Question

Próbuję więc wyrównać obraz w pionie w obrębie elementu div kontenera. Próbowałem dodać vertical-align: middle; do rodzica div bez powodzenia.

<div class="contributor_thumbnail"><img src="image.jpg"></div> 
    <div class="contributor_thumbnail"><img src="image.jpg"></div> 

.contributor_thumbnail { 

    position: relative; 
    display: block; 
    float: left; 
    width: 150px; 
    height: 150px; 
    line-height: 100%; 
    text-align: center; 
    margin-right: 15px; 
    margin-bottom: 15px; 
    padding: 5px; 
    vertical-align: middle; 
    border: 1px solid #bbbbbb; 
    border-top: 1px solid #333; 
    border-left: 1px solid #333; 

} 

Answer 1

Co chciałbym zrobić, to ustawić zdjęcie jako tapetę.

.contributor_thumbnail { 
    /* Background image instead of using and img tag */ 
    background: url(image.jpg) center center no-repeat; 
    position: relative; 
    display: block; 
    float: left; 
    width: 150px; 
    height: 150px; 
    line-height: 100%; 
    text-align: center; 
    margin-right: 15px; 
    margin-bottom: 15px; 
    padding: 5px; 
    border: 1px solid #bbbbbb; 
    border-top: 1px solid #333; 
    border-left: 1px solid #333; 

} 

Answer 2

.contributor_thumbnail img { 
    margin-left: auto; 
    margin-right: auto; 
} 

http://www.bluerobot.com/web/css/center1.html

Answer 3

Spróbuj tego:

HTML

<div class="contributor_thumbnail"> 
<div class="content"> 
    <img src="image.jpg"> 
</div> 
</div> 

CSS:

.contributor_thumbnail {float:left; height:50%; margin-bottom:-120px;} 
.content {clear:both; height:240px; position:relative;} 

Zainspirowany: Lost in the Woods vertically centering with CSS.