Ikon menu pomoc

robbie:
Tak například tím, že tu výšku řádku nastavíš sám. Viz živá ukázka.

Zarovnáš vedle sebe dva elementy. Do jednoho nacpeš obrázek, do druhého nacpeš další dva elementy, které zarovnáš pod sebe. Když to celé bude mít výšku 60px, tak ty dva nad sebou budou mít každý 30px. Problém ale nastane, že když to uděláš, tak si všimneš, že ty dva řádky jsou strašně daleko od sebe. To jde v zásadě řešit dvěma způsoby. Prvním je, tak jako na ukázce, zmenšit výšku těch elementů a doplnit to paddingem. Druhou možností by bylo pomocí vertical-align (to ale asi platí jen pro tabulky) či flex. Jenže tabulky do toho asi motat nechceš. Flex by byl lepší variantou...

Ještě doplním, že takto to vypadá, když to necháš jen na 30px vysoké řádky a nedorovnáš to tím paddingem
Takto s využitím flexu
Tím vertical-alignem se mi to nedaří, ani se o to nijak víc pokoušet nebudu. Nepřijde mi to jako správné řešení. Patří to k tabulkám a položka v menu rozhodně není tabulka :)

RastyAmateur:
„Druhou možností by bylo pomocí vertical-align (to ale asi platí jen pro tabulky) či flex.“
display: table-cell podporuje i IE 8 (možná i "sedmička"), u konkurenčních prohlížečů je podpora ještě lepčí.

Edit
Pro elementy s display: table-cell lze použit vertical-align.

Bubák:
Jen pro úplnost, IE7 nikoliv, tam by se muselo dopočítat javascriptem. Ale to už je historie, display-* hodnoty lze normálně používat.