Reihenfolge der CSS-Klassenspezifität
Ich habe meine eigene CSS-Klasse definiert:
.my-ui-table td {
border-width: 1px;
border: 0;
padding: 5px 10px;
border-style: hidden;
border-color: inherit;
}
Das standardmäßige PrimeFaces-CSS definiert eine eigene Klasse, die angewendet wird auf:
.ui-panelgrid td {
border-width: 1px;
border-style: solid;
border-color: inherit;
padding: 4px 10px;
}
Beide Klassen werden auf Tabelle angewendet:
<table class="ui-panelgrid ui-widget my-ui-table" role="grid">...</table>
Wenn Chrome diese Tabelle rendert, hat der Rahmenstil aus der ui-panelgrid-Klasse Vorrang vor dem Rahmenstil, der in der my-ui-table-Klasse definiert ist. Ich habe die CSS-Spezifität nachgelesen und die Art und Weise, wie sie spezifisch zu sein scheint, ist für beide Klassendefinitionen gleich, daher sollte das zuletzt in class = "" angegebene Attribut gewinnen. Warum passiert das nicht?
EDIT: HTML head tag:
<head>
<link type="text/css" rel="stylesheet" href="/webapp/do/javax.faces.resource/my.css?ln=css">
<link type="text/css" rel="stylesheet" href="/webapp/do/javax.faces.resource/primefaces.css?ln=primefaces">
</head>
.