CSS Vertical align tekst na środku obrazu

Question

Powiel możliwe:
How do I vertically align text next to an image with CSS?

mam trudności z centrum rozciąga vertically middle w div.

Ten prosty kod: http://jsfiddle.net/4hDTb/

HTML:

<div class="bar"> 
    <span>Simple text</span> 
    <img src="" class="img1" /> 
    <span>Another text</span> 
    <img src="" class="img2" /> 
</div>​ 

CSS:

.bar 
{ 
    width: 100%; 
    height: 50px; 
    border: 1px black solid; 
} 
.img1 
{ 
    width: 100px; 
    height: 50px; 
    border: 1px black solid; 
} 

.img2 
{ 
    width: 200px; 
    height: 50px; 
    border: 1px black solid; 

} 

Jak wyśrodkować <span>s w div.bar pionowo pośrodku?

Answer 1

wystarczy dodać img{vertical-align:middle}. to obrazek, który chcesz dopasować, a nie tekst.

Answer 2

jeśli znasz wysokość zbiornika - można użyć line-heighthttp://jsfiddle.net/4hDTb/3/ czek na skrzypcach ..