Perché il mio! Importante attributo non funziona su Google Chrome?

Question

Ho due file CSS nella mia app Web: reset.css e screen.css. Appaiono in quell'ordine in html (ripristina quindi la schermata).

Nel reset.css, la seguente definizione di stile si verifica:

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { 
    border-bottom-width:0; 
    border-color:initial; 
    border-left-width:0; 
    border-right-width:0; 
    border-style:initial; 
    border-top-width:0; 
    font-family:inherit; 
    font-size:100%; 
    font-style:inherit; 
    font-weight:inherit; 
    margin-bottom:0; 
    margin-left:0; 
    margin-right:0; 
    margin-top:0; 
    outline-color:initial; 
    outline-style:initial; 
    outline-width:0; 
    padding-bottom:0; 
    padding-left:0; 
    padding-right:0; 
    padding-top:0; 
    vertical-align:baseline; 
} 

Si può vedere che span è in questo elenco, e per impostazione predefinita ha un font-size del 100%.

Nel mio screen.css, ho il seguente:

dl.labels-left dt span.req { 
    display:inline; 
    font-size:14px !important; 
} 

mio HTML ha il seguente estratto:

<div> 
    <dl class="labels-left"> 
     <dt class="larger-a-left"> 
      <label>Name:</label> 
      <span class="req">*</span> 
     </dt> 
... 

Il problema che sto avendo è che il font-size: 14px !important; è di essere sovrascritti da il file CSS nel file di ripristino, ma solo in Google Chrome. Non riesco a capire perché!

Ecco un Firebug Lite screenshot che mostra il font-size sbarrato: Firebug Screenshot http://www.damianbrady.com.au/images/firebug_screenshot.png

Perché è il mio stile reset.css essere considerato più importante la definizione della classe specifica?

Secondo la mia comprensione di W3C CSS 2.1 Specificity, questo non dovrebbe accadere!

Answer 1

Forse l'ispettore sta attraversando fuori in modo improprio ma visivamente è giusto?

Answer 2

Si tratta di un bug di Firebug Lite. Firebug Lite è riassumendo il valore specificità di ogni selettore definita nella regola (e non solo quelle corrispondenti, come la specifica CSS dice), in modo che si traduce in un valore sovrastimato.

Ho appena compilato un rapporto sul problema. Si prega di "stella" (sottoscrivi) il problema se si desidera ricevere aggiornamenti via email circa i nostri progressi con questo particolare problema:

http://code.google.com/p/fbug/issues/detail?id=3262

Inoltre, la prossima volta, per le questioni Firebug/Firebug Lite, provare a utilizzare la nostra lista di discussione o il nostro bug tracking. Altrimenti potremmo non essere consapevoli del problema.

Grazie per il rapporto dettagliato a proposito!