Text mittig rechts neben Bild

[Krobbus]

<h2>Zahlungsmöglichkeiten:</h2>
        <ul>
            <li><a href="#"><img src="img/logo-mastercard.jpg" alt="Mastercard">Kreditkarte</a></li>
        </ul>

Leider fängt die Schrift ("Kreditkarte") am unteren Rand des Bildes an und geht nicht mal zur Mitte des Bildes, ich hätte aber gerne das es genau mittig rechts neben dem Bild ist. Wie mache ich das am saubersten?

 

[threadi]

Falls diese Grafik nicht allzu groß ist würde ich vorschlagen sie als Hintergrundbild in den Link zu setzen. Dieses kannst Du dann auch mit "background-position" mit Prozentangaben mittig ausrichten.

Alternative:

img { display: inline;vertical-align: middle; }

 

[prm]

Wenn's einzeiliger Text ist in Anlehnung an dieses Beispiel, Ziffer 5:
Text zu Bildern anordnen

<h2>Zahlungsmöglichkeiten:</h2>
<ul>
<li><a href="#"><img style="float: left; margin-right: 10px;" src="img/logo-mastercard.jpg" alt="Mastercard"></a><p style="line-height: 60px;"><a href="#">Kreditkarte</a></p> </li>
</ul>

Als line-height nimmst du dann den Wert, welcher der Grafikhöhe entspricht.

In diesem Fall spricht aber m.E. auch nichts gegen die Verwendung einer Tabelle.