CSS-Spezifizität: Selektor mit ID überschreibt Selektor nicht mit Klasse?

Question

Ich bin nicht gut in CSS, aber ich verstehe die Grundidee der Spezifität (oder so denke ich). Kürzlich wurde versucht, ich die Tabelle CSS den Bootstrap 3, die für jede Zelle, wie so definiert wurde, außer Kraft zu setzen (dies ist ein Teil-Bit, das Teil, das wirksam auf dem inspizierten Elemente war):

.table > tbody > tr.danger > td, .table > tfoot > tr.danger > td { 
    background-color: #ddd; 
} 

I versuchen überschreiben sie die Hintergrundfarbe der gesamten Zeile, die die Zelle enthalten ist, mit diesem:

table#results > tbody > tr.highlighted { 
    background-color: #ffd15b; 
} 

, die, wie ich es verstehe, höhere Spezifität aufgrund der ID hat. Allerdings war es gar nicht funktioniert, bis ich das Kind td in meinem CSS eingeführt:

table#results > tbody > tr.highlighted > td { 
    background-color: #ffd15b; 
} 

Warum hat meine ersten Versuch Arbeit? Ich probierte in Safari und Chrome (neueste Versionen)

Answer 1

Ihr Problem ist nicht CSS-Spezifität, sondern nur der Hintergrund der Zelle (<td>) versteckt den Hintergrund der Zeile (<tr>) dahinter.

Answer 2

Versuchen Hinzufügen border-collapse Eigenschaft der übergeordneten Tabelle wie unten
table#results { border-collapse: collapse;}