vertical-align bezieht sich bei Blockelementen seit jeher auf die Elemente einer Zeile. Wenn du ein fünf Zeilen hohes Bild in eine Zeile setzt, dann wird der Text bei vertical-align:middle mittig an das Bild gesetzt:
alles klar, line-height anstatt height bringt das gewünschte Ergebnis. Die Logik dahinter würde mich noch interessieren, nicht weshalb es dann funktioniert(das hast Du ausreichend erklärt: Zentrierung innerhalb Zeile), sondern warum das so(zeilen-anstatt block/containerbasierend) angedacht ist?
vertical-align existiert, damit Bilder in einer Zeile, wie beschrieben, anständig ausgerichtet werden können – da lässt sich eigentlich nicht viel zu sagen und ich bin mir ziemlich sicher, dass du irgendwann auch schon mal einen Fall hattest, wo das von Nöten war.
Mir fallen im Moment nur diese unsäglichen Smileys ein, mit denen sich in diversen Boards das Geschreibsel verschlimmbessern lässt. So ein Kringel sollte vielleicht mittig zum Text liegen und zwar …
o
o ooo
so ooo und nicht so o oder so o
o ooo
o
Falls du dich hingegen wunderst, dass es keine vertikale Zentrierung eines Blocks gab: Das ist halt so. Ich kann mich auch noch an Zeiten erinnern, in denen man Blockelemente nicht einmal horizontal zentrieren konnte, obwohl das in CSS vorgesehen ist (mit margin, nicht text-align, text-align wirkt wie vertical-align auch nur auf die Zeile); die Browser haben das oftmals nicht hinbekommen.