Hallo Hanno,
Das vertical-align läuft bei mir irgendwie nicht. ICh hab da
folgendes Beispiel:
.center{
[...]
vertical-align: middle;
}
[...]
<div class="center">
Zum einen: vertical-align darf man nicht bei Blockelementen verwenden. Hat einfach keine Wirkung. <div> ist ein Blockelement.
Zum anderen:
Bei Inlineelementen wirkt sich vertical-align so aus:
+----------------------------------------------------------------------------------+
| * * * * +------------+ |
| * * * * | Inline-Box | |
| * * * * +------------+ |
| ******* **** * * ****** +-------------+ |
| * * * * * * * * | Inline-Box | |
| * * * * * * * * +-------------+ |
| * * ****** ** ** **** +------------+ |
| | Inline-Box | |
| +------------+ |
+----------------------------------------------------------------------------------+
Der ganze Kasten soll eine "Zeilenbox" darstellen, die von Text erzeugt wird. Irgendwelche Boxen, die von Inlineelementen erzeugt werden, werden dann zu dieser Zeilenbox ausgerichtet. Die erste Inlinebox hat vertical-align: middle;, die zweite vertical-align: top; und die dritte vertical-align: bottom; Eine Zeilenbox wird von einem Blockelement "oben" erzeugt.
Einzig bei Tabellenzellen wirkt sich vertical-align so aus, wie Du es willst.
Viele Grüße,
Christian