Delší dobu jsem měl problémy s vertikálním centrováním v elementu s fixní výškou, ale konečně jsem našel řešení :) je to nakonec (jak se dalo předpokládat) velmi prosté. Fígl na vertikální centrování naleznete v tomto článku.Problém je tedy následující:
CSS:

.menu-item {
    height:3em;
    width:100px;
    text-align:center;
    border:1px solid #000;
    }

HTML:

Centrovaný text

Uvedený kód se zobrazí jako element s horizontálně vycentrovaným textem, který je však umístěn na horní okraj elementu. Kliknutím na ukázku 1 se zobrazí první fáze problému. V tomto případě nemá význam používat vlastnost vertical-align:center, neboť tato je funkční pouze u stylování tabulkový políček.

V našem případě pomůže CSS vlastnost line-height, která zajistí horizontální vycentrování. Hodnota této vlastnosti musí být totožná s výškou elementu.

Řešení tedy bude:

.menu-item {
    height:3em;
    width:100px;
    text-align:center;
    border:1px solid #000;
    line-height:3em;
    }

Na výsledek této definice se můžete podívat v souboru ukázka2.
Osobně jsem toto řešení ještě nepoužil, protože když jsem na problém vertikálního centrování narazil a neznal jsem tuto metodu, navrhl jsem strukturu CSS malinko jinak a problém jsem tím pádem obešel :)