Ich verwende das folgende Css:
/* style.css */
#someId {
background-color: red;
}
#someId.medium {
width: 300px;
}
#someId.large {
width: 500px;
}
mit der html:
<!-- medium.html -->
<div id="someId" class="medium">hello, world</div>
et
<!-- large.html -->
<div id="someId" class="large">hello, world</div>
Ich weiß, dass das obige unter FireFox und Opera gut funktioniert, und es funktioniert no auf IE6 funktionieren (Überraschung, Überraschung).
Meine Fragen sind:
Ist das obige CSS gemäß den CSS-Spezifikationen korrekt (und wo kann ich dieses spezifische Problem finden)?
Welche Browser (auf welcher Plattform) unterstützen dies und welche nicht?
Aktualisierung:
Die IDs sind pro Seite eindeutig. Ich habe versucht, dies zu kommunizieren, indem ich medium.html
y large.html
aber offensichtlich war das nicht offensichtlich genug.
Update 2:
Das obige Codebeispiel wurde nur geschrieben, um meine Frage zu veranschaulichen. Es ist nicht Teil des Produktionscodes und erhebt keinen Anspruch auf Vollständigkeit. Kurz gesagt, es ist nur ein Beispiel, um ein Problem mit einer sehr spezifischen Lösung zu demonstrieren.