Hallo,

ich habe gestern mal versucht das hier Advanced (yet awesome) pure CSS3 boxes without using images « Design and Development tuts – TutorialShock soweit wie möglich auch für Firefox und Opera nachzubauen.
Hier liegt die Testseite: Css3 Boxes

Dabei bin ich im Firefox auf zwei merkwürdige Probleme gestoßen:
1. Das Tutorial arbeitet an einigen Stellen mit :before und :after und negativem z-index, um z.B. räumliche Schatteneffekte zu erzeugen. Aus irgendwelchen Gründen scheint aber der Firefox (Chrome, Safari und Opera machen dagegen alles richtig) bei der Stapelung etwas "unstetig" zu sein. Mal erscheinen die Elemente mit negativem z-index im Vordergrund und mal wie gewollt im Hintergrund. Dabei genügt teilweise schon scrollen, um von einem in den anderen Zustand zu wechseln. Einzige Ausnahme ist Box16 (die unterste auf der Seite), da macht es der Firefox immer falsch und holt den Schatten in den Vordergrund.
So soll es sein:
Aber der Firefox macht nach "Lust und Laune" meist folgendes:
Noch merkwürdiger ist, dass das Problem nur bei der auf dem Server liegenden Seite auftritt und sich lokal nicht nachstellen läßt.
Hat jemand 'ne Ahnung was man da machen kann?

2. Das zweite Problem ist ein kleiner Schönheitsfehler, der beim Zusammentreffen von -moz-box-shadow und -moz-transform auftritt: Wenn ich Elemente die einen Schatten haben drehe, verschwindet der Schatten ganz oder teilweise.
So soll es aussehen (und sieht es in Chrome, Safari und Opera auch aus):
Und so sieht es im Firefox aus:
Ich hab schon gegoogelt, aber nichts zu dem Problem finden können. Naja, vielleicht auch noch zu frisch.
Hat jemand dazu vielleicht 'ne Idee?

Bei mir im FFox 4 (RC1 seit gestern) sieht es top aus.

Allerdings finde ich "räumliche Schatteneffekte" ein wenig übertrieben ... die Schatten sind "falsch" und passen nicht zum Objekt

__________________
“My software never has bugs. It just develops random features ...”

» DevShack - die Website des freien Webentwicklers Boris Bojic

Ah ok, gut zu wissen. Mein FF 3.6.15 läßt es blöd aussehen.
Und die mit Schatten/Umrandungen der schrägen "Klebestreifen" sind bei Dir auch vollständig?

Mag sein, mein Anliegen war es ja (bisher) nur zu erkunden, ob und wieviel aus dem Tutorial, das nur für Webkit-Browser gedacht war, auch in anderen Browsern umsetzbar ist.
Aber Du hast natürlich recht, manche der Schatten (nicht alle) sind Blödsinn.