2010-02-16 5 views
6

Probleme mit bestimmten Hintergrundbildern, die in Firefox/Opera angezeigt werden, spielen alle anderen Browser (außer IE, für den ich Kompromisse eingehen musste).Handhabt Firefox/Opera positionierte/mehrere Hintergrundbilder?

Derzeit Opera kann nicht mehreren Hintergrundbilder wie so:

background-image: url('/images/h2_default_bg.png'), url('/images/dashed_bg_default.gif'); 
background-repeat: no-repeat, repeat-x; 
background-position: top left, bottom left; 

beide auch Firefox und Opera sind die beide umständlich, wenn ein Hintergrundbild in Pixeln positioniert ist:

background: url('/assets/images/dashed_bg.gif') bottom 2px repeat-x; 

Sind Gibt es eine einfache Problemumgehung für jedes dieser Probleme?

Antwort

5

Mehrere Hintergründe werden nur ab Firefox 3.6 und Opera 10.5 unterstützt. Sind das die Versionen, in denen Sie testen? Chrome und Safari bereits unterstützen sie, die ich Ihnen mit „allen anderen Browsern ... außer natürlich IE“

Was Ihre zweite Problem bedeuten vermuten, the spec says this about the background-position syntax:

Wenn zwei Werte angegeben und mindestens Ein Wert ist kein Schlüsselwort, der erste Wert repräsentiert die horizontale Position (oder den Offset) und der zweite Wert repräsentiert die vertikale Position (oder den Offset).

Sie haben sie also in der falschen Reihenfolge angegeben. Machen Sie es stattdessen 2px bottom.

+1

Ahh, ich fühle mich jetzt wie ein Idiot. Danke, so ein einfacher Fehler. Ich glaube nicht, dass mein Opera so aktuell ist, mein Schlechter, aber zumindest werde ich wissen, dass es jetzt nicht in allen Versionen funktioniert. – JFK1980

+0

+1 guten Fang mit dem Hintergrundbild. –

3

Derzeit Opera nicht mehr Hintergrundbilder wie so erlaubt:

Mehrere Hintergrundbilder wie das sind nicht möglich in CSS2/2.1, die wir im Moment noch have to adhere to.

Siehe hierzu quirksmode page on which browsers currently support multiple backgrounds.

Wie auch bei den anderen Einstellungen funktioniert die Hintergrund-Position auf jeden Fall über Browser hinweg. Mir sind dort keine Inkompatibilitäten bekannt. Was genau passiert in Firefox und Opera?

+0

Mehrere Hintergründe sind neu in CSS3: http://www.css3.info/preview/multiple-backgrounds/ aber es ist noch nicht wirklich unterstützt (offensichtlich). –

+0

@Felix ah, ich verstehe. Danke für die Köpfe hoch. –

+0

Funktioniert perfekt in Chrome, FF und Safari. IE nicht, aber das war keine Überraschung, und ich musste aus verschiedenen Gründen eine Abhilfe schaffen. Ich fand diese Notation gestern, als ich nach Antworten suchte, ich hatte sie auch nicht gesehen, aber ich war beeindruckt, dass es in besagten Browsern funktioniert hat. – JFK1980

0

Wie Sie herausgefunden haben, funktionieren mehrere Hintergründe in allen modernen Browsern. Es funktioniert in Opera ab Version 10.5. Es gibt keine Informationen darüber, ob IE9 es haben wird oder ob/wann IE es jemals unterstützen wird.

+0

Ja, aber Opera 10.5 ist immer noch in der Beta und FF 3.5 ist ziemlich solide, so dass es einige Zeit dauern wird, bis die Leute von den älteren Versionen abwandern. – Piskvor