: nicht () Selektor -Diskrepanz zwischen Safari, Chrome und Firefox

Browser implementieren häufig Funktionen mit variierenden Fähigkeiten, was dazu führt, dass sie zu Diskrepanzen führt. Der CSS: Not () Selektor ist ein solcher Fall, in dem er unterschiedliche Verhaltensweisen über Safari, Chrome und Firefox hinweg aufweist.

Problem:

Der: Nicht () -Stumschalter funktioniert nicht wie erwartet, wenn sie mehrere Ebenen in dem Argument angeben. In diesem Beispiel:

em:not(div) {
    color: red
}
em:not(p div) {
    color: blue
}

safari rendert den Text in blau, während Chrome und Firefox Red verwenden. Chrome und Firefox unterstützen dagegen nur Argumente für einzelne Ebenen in der aktuellen Version von: nicht ().

Erläuterung:

Ein komplexer Selektor enthält mehrere zusammengesetzte Selektoren, die von Kombinatoren getrennt sind (z. B. Nachkommen, SIBONBLING). In diesem Fall ist "P div" ein komplexer Selektor, der aus zwei zusammengesetzten Selektoren ("p" und "div") vom Nachkommenskombinator getrennt ist. In einem "P" -Element verschachtelt.

aktueller Status:

Es wird erwartet, dass Chrome und Firefox schließlich die neue Spezifikation übernehmen werden, was zu konsequentem Verhalten zwischen Browsern führt. Bis dahin sollten Entwickler potenzielle Diskrepanzen bei der Verwendung: nicht () Selektoren mit mehreren Ebenen in diesen Browsern kennen.