✔ Grafik vor Text

[truckdriver]

Hallo,

ich möchte gerne folgendes mit CSS realisieren. Für die Gestaltung von Überschriften möchte ich vor dem Text eine Grafik anzeigen lassen.

Das Pseudoelement :before ist mir bekannt, funktioniert aber leider nicht mit dem Internet Explorer. Mir ist wichtig, dass die Seite in den gängigen Browsern korrekt dargestellt wird.

Wäre es evtl. möglich mein Vorhaben mit list-style-image zu realisieren? Dazu müsste ich allerdings den automatischen Einzug "verhindern", um die Überschrift und den weiteren Text in einer Linie linksbündig darstellen zu lassen (falls das überhaupt möglich ist).

Freue mich über entsprechende Lösungsvorschläge. Danke!

 

[Maik]

Hi,

eine "browserübergreifende" Möglichkeit wäre, die Grafik als Hintergrundbild für das Überschriftenelement zu definieren.

h1 {
background: url(pfad/zur/grafik.jpg) no-repeat;
padding-left: 15px; /* entspricht der Grafikbreite und dient zur Texteinrückung */
}

 

[truckdriver]

Klappt wunderbar!

Vielen Dank für die schnelle und hilfreiche Auskunft!