• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bild auf Höhe mit Text bringen.

Degers

Mitglied
Hallo,

aus dem Thread http://www.html.de/websitecheck/422...de-inhaltlicher-aufbau-editor.html#post304356 einfach mal extrahiert, da dort etwas Offtopic, eine kleine Problemstellung.
Ich möchte ein Bild auf eine Höhe mit einem Text bringen. Mit vertical algin klappt es nicht, bottom ist unter dem Text, baseline über den Text, top ebenfalls über dem Text. Middle reagiert wie Baseline. Kann ich das Bild nun mit CSS auf eine Höhe mit dem Text bringen? Als Alternative fällt mir noch ein Rand im Bild ein, was aber nicht gerade die eleganteste Lösung wäre.
Ich habe die Situation aus dem Kontext mal herausgenommen:
Bild auf Texthöhe
 
Werbung:
meinst du so?
HTML:
<div style="width:400px; background:#CCC"><img src="http://bilder.bild.de/fotos/logo-17539134/Bild/2.bild.gif" style="float: right" />
BILD.de: Die Seite 1 für aktuelle Nachrichten und Themen, Bilder und Videos aus den Bereichen News, Wirtschaft, Politik, Show, Sport, und Promis.
</div>

<img /> muss aber über dem text sein
 
Auf deiner Beispielseite sehe ich, dass Du das innerhalb eines Links machst. Mach es doch anders: gib die Grafik als Hintergrundbild dem Link und positioniere es per background-position an der richtigen Stelle. Ist dank CSS-Klassen dann auch flexibel nutzbar.

Habe das Topic auch gleich mal zu CSS geschoben, da die Gestaltung nicht HTML-Aufgabe ist.
 
Werbung:
Ich kann nicht erkennen, was dein Beitrag mit meiner Problemstellung zu tun hat, abcxx. Vielleicht hab ich mich undeutlich ausgedrückt.

Gute Idee threadi, hat genauso wie beschrieben funktioniert. Manchmal sieht man den Wald vor lauter Bäumen nicht, danke.

HTML:
<a href="#" style="background-image: url(unchecked.gif);background-repeat:no-repeat;padding-left:17px;">Fehler melden</a>
 
Zurück
Oben