|
|||
Firefox ignoriert Kaskade im CSS
Ist das neu, das der Firefox die IDs und Classen ignoriert wenn eine weitere CSS dazu kommt, dort z.B. nur eine Klasse gesetzt wird.
Im Chrom ist es absolut korrekt, ich hab Beispielsweise eine Überschrift H1 die von CSS1 auf font size 25px steht. In CSS2 steht diese auf 50px. Steht nur beides mit je einer Klasse im CSS ist klar, dass das CSS sticht was als letztes geladen wird. Sprich in dem Fall sticht CSS2 die Angaben von CSS1. Alles so weit richtig. Schreibe ich aber nun bei CSS1 eine ID oder eine weitere Klasse zu der H1 hinzu. Sticht im Chrom ganz klar die CSS Anweisung die mehr Kaskaden hat als andere, somit ist die eingebundene Reihenfolge egal, da in CSS1 die H1 mit id und Klasse, die H1 aus CSS2 mit nur einer Klasse überschreibt. Im Firefox ist das aber nicht mehr relevant, hier überschreibt mein CSS2 mit einer Klasse, sämtliche Angaben aus CSS1 das IDs und Klassen enthält. IE arbeitet wie Chrom meiner Meinung nach korrekt. War das verständlich ? Fragt erst garnicht wieso ich das nicht in eine CSS packe oder mehrmals schreibe, wir haben eine sehr große Seite. |
Sponsored Links |
|
|||
Dafür gibt es die Webdeveloper-Tools, die zeigen einem genau, welches CSS hier geladen wird und warum welche Regel angewandt wird. Und nein, Firefox ignoriert Kaskaden nicht, sonst würden sämtliche Websites nicht mehr ordentlich funktionieren. Da liegt das Problem beim Seitenersteller -> Falsch (zu viel?) gecached, Links falsch gesetzt, etc.
|
Sponsored Links |
|
|||
Cloned ich weiß schon welche CSS geladen werden und auch in welcher Reihenfolge, dennoch überschreibt der Firefox Anweisungen für ein Element das in CSS1 mit einer ID + mehreren Klasse (SCSS) definiert ist mit einer einzigen Klasse aus einer zweiten CSS. Ich kann doch in CSS1 nicht alles mit !important stylen. Auf manchen Seiten soll CSS2 ja greifen und auf anderen CSS1.
Ich bin seit mehreren Jahren Frontend Developer, ich weiß schon wie ich die DEV Tools benutze Schau den Screenshot an und sag mir wieso die Anweisungen unten überschrieben werden, und das nur im Firefox. IE und Chrom überschreiben die oberen Anweisungen. Da die unteren ja eine höhere Gewichtung haben. |
|
|||
Zitat:
Das Problem mit dem Firefox ist auch neu, das kam entweder seit dem letzten Update oder seit dem vorletzten. |
|
|||
Dann verusche dein Test-CSS/HTML mal zu kopieren und hier einzufügen, natürlich so minimiert, dass es auch für uns nachvollziehbar ist.
Code:
<div id="test"> <div data-bank-group="psd" > This is a TEST </div> </div> [data-bank-group="psd"]::after{ color: green; content: "ASDF"; } #test [data-bank-group="psd"]::after{ color: blue; } |
|
|||
Meinetwegen auch das
Nimm Deinen Code splitte die beiden Anweisungen auf CSS1 und CSS2 auf und lade diese nacheinander. Sollte ja blau raus kommen, da es in CSS2 steht. Jetzt nimmst die ID und schreibst die bei CSS1 rein. Jetzt hat die Anweisung in CSS1 mehr Gewichtung und überschreibt CSS2 im Chrome und IE, nicht aber im Firefox, der macht weiterhin blau. |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Firefox lädt Clipping Mask CSS nicht richtig bei Weiterleitung auf HTTPS Seite | TheRiddler1982 | CSS | 4 | 10.09.2015 17:29 |
FireFox und Chrome benutzen CSS nicht, IE und Opera schon | Martin69 | CSS | 7 | 07.02.2012 13:28 |
Externes CSS für Firefox 3.5 | BeatrixKiddo | CSS | 7 | 06.09.2011 17:37 |
Redesign für Steiner Cycling Team | pkipper | Site- und Layoutcheck | 11 | 09.02.2011 13:25 |
Mozilla ignoriert externes css | DarkWanderer | CSS | 9 | 22.09.2005 12:39 |