Ein DIV, zwei Hintergründe?

[Stefan Beyer]

Liebe User,

um die Template meiner Blooger.com-Internetseite meinen Wünschen anzupassen, kämpfe ich mich tapfer durch die CSS-Vorlage dieses gelungenen vorgegebenen Designs.

Im Header-Feld möchte ich den bloßen Farbton durch eine eingefärbte Grafik austauschen. Der ursprüngliche Programmierer benutzte in seiner Variante einen Farb-Code für die schlichte Färbung, und ein teilweise transparentes GIF-Hintergrund, um dem plumpen roten Viereck trickreich den Anschein runder Ecken zu geben.

Nun - auf die runden Ecken werde ich nicht verzichten können, wenn auch mein Header so geschmeidig in den Gesamtlook passen soll. Aber wenn also diese Ecken-Grafik nicht raus kann - wie komme ich dann zu meinem individuellen Hintergrundbild? Lange Rede - hier der CSS-Code:

#header {
    background:url("http://8ung.at/stefanbeyer/stefan/header.jpg") no-repeat left top;
    background:url("http://www.blogblog.com/rounders2/corners_cap_top.gif") no-repeat left top;
    margin:0 0 0;
    padding:8px 0 0;
    color:#fff;
    }

• Die zwei Grafiken widersprechen sich natürlich, der Browser kann's nicht darstellen. Er zeigt nur die letzte Grafik an, die erste ignoriert er. Jede Grafik für sich funktioniert prima - aber wie kann ich beide in meinem Sinne benutzen?

• Kompliziert, was ich meine. Hoffentlich konnte es jemand verstehen ;).

Liebe Grüße,

Stefan

[Hopsel]

Hi Stefan!

Jede Grafik für sich funktioniert prima - aber wie kann ich beide in meinem Sinne benutzen?

Weise das zweite Hintergrundbild einem Element, das in #header existiert, zu und positioniere es deinen Vorstellungen entsprechend

Oder verbinde die zwei Hintergrundbilder zu einem. Dann musst du noch dieses Bild einbinden.

MfG H☼psel

[Stefan Beyer]

Yeah - endlich!

Mann, CSS ist eine harte Sache :-/...

Dankeschön für die Hilfe :-)!

Adieu

Stefan

[MudGuard]

Hi,

in guten Browsern könntest Du eines der Hintergrundbilder im Pseudo-Element :before bzw. :after anzeigen lassen.

Alternative: Warten, daß das CSS 3 Modul "background" verabschiedet und in den Browsern implementiert ist.

Für den IE gilt: pro Element ein Hintergrundbild.

cu,
Andreas