Bild mittig in Text einbauen

rernanded

rernanded

Erfahrenes Mitglied
Hallo,

ich muß ein Bild anstatt eines Bindestrichs einbauen.

Im konkreten Fall ein Flaggenbild statt des Bindestrichs beim Begriff "Jahres-Empfang".

Und zwar in Höhe des Bindestrichs und das bei jeder Schriftgröße ab 200px und unabhängig von der Bildgrösse deren Höhe immer kleiner ist als die Schrifthöhe.

Ein img hat idR die Angewohnheit sich leider nach unten zu verkrümeln.

MONI
 
Ein img hat idR die Angewohnheit sich leider nach unten zu verkrümeln.
Zum Vergrößern anklicken....
Das liegt daran, dass der Default-Wert für vertical-align baseline ist. Änderst Du es auf middle, rutscht das Bild sofort in die Mitte:
vertical-align: middle;
 
Ich hab's probiert und es hat funktioniert:
Code: 
<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title>Testseite001</title>
    <style>
        #centered-img {
            font-size: 200px;
        }

        #centered-img img {
            vertical-align: middle;
        }
    </style>
</head>

<body>
    <span id="centered-img">
        Jahres<img src="images/buttonplay.png">Empfang
    </span>
</body>

</html>
 
Ah, ich sehe den Unterschied.
Ich hatte es inzwischen mit padding-bottom probiert, muß dann aber die px für das img immer je nach Schriftgröße ändern.
Danke Dir, komme nun klar.
MONI
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück