[rozwiązany] Wyrównanie <h2> w pionie Opcje

[witus]

Mam pewien problem z wyrównaniem linków osadzonych w <H2> do środka obrazka, w pionie.



Jak widać na obrazku, ikonki znajdują się tuż obok znaczników H2 i są osadzone jako zwykły obrazek <img>. Próbowałem nadawać dla H2 line-height oraz vertical-align, ale niestety to nie pomogło. Kombinowałem także z użyciem margin-bottom, ale ta metoda również nie przyniosła zamierzonego efektu. Macie może jakieś pomysły?

Kod:

[HTML] pobierz, plaintext 
<div id="postfooter">
 
<div id="postfooter-info">
<img src="wp-content/themes/colorfolio/images/kategoria.png" alt="kategoria" /><h2><?php the_category(' '); ?></h2>
<img src="wp-content/themes/colorfolio/images/tag.png" alt="tagi"/><h2><?php the_tags(''); ?></h2>
</div>
 
</div>
[HTML] pobierz, plaintext 

css:

[HTML] pobierz, plaintext 
#postfooter{
background-color: #FAFAFA;
width: 624px;
margin-left: 3px;
border: 1px solid #f1f1f1;
color: #cacaca;
font-size: 10px;
font-family: verdana;
height: 150px;
}
 
 
#postfooter img{
border: 0;
}
 
#postfooter a:link, #postfooter a:visited, #postfooter a:active{
text-decoration: none;
color: inherit;
font-size: inherit;
}
 
#postfooter a:hover{
color: #818181;
}
 
#postfooter-info h2{
font-weight: normal;
display: inline;
}
 
#postfooter-info{
 
}
 
#postfooter-info img{
padding-right: 10px; padding-left: 10px;
}
[HTML] pobierz, plaintext 

Liczę na Waszą pomoc.

EDIT: tuż po napisaniu postu udało mi się rozwiązać problem. Do klasy obrazka trzeba było dodać vertical-align: middle, a potem to samo do H2 i jeszcze dodatkowo line-height: 25px. Ostatecznie efekt jednak mi się nie podobał, więc do obrazka dorzuciłem jeszcze margin-bottom i wszystko już działa tak, jak chciałem.

Ten post edytował witus 25.08.2010, 11:00:19