CSS Zibaldone

[ Home ] - [ Articoli ] - [ Traduzioni ] - [ Altro ] - [ Appunti sui CSS ] - [ L'autore ]

Sei qui: Home > Articoli > Gestione degli spazi nei selettori in Internet Explorer 5

Gestione degli spazi nei selettori in Internet Explorer 5

Negli hack per Internet Explorer 5 Windows bisogna considerare attentamente la gestione degli spazi nei selettori avanzati dati per nascondere a questo browser delle regole di stile. Per esempio:

body>#box {...}

Come si può notare dall'esempio, non ci sono spazi tra il selettore e gli elementi body e #box. Ipotizziamo di aver inserito degli spazi:

body > #box {...}

Il parser di Explorer 5 avrebbe interpretato la regola come se fosse stata:

body #box {...}

proprio per la presenza degli spazi. Infatti il selettore del figlio viene ignorato e restano semplicemente i due selettori di tipo la cui relazione di parentela è vera (true). Mi sono accorto di questa caratteristica del parser di Explorer 5 scrivendo una semplicissima regola di stile:

h1 + p {border-bottom: 1px solid #000;}

Data la presenza degli spazi, Explorer 5 ha interpretato la regola come se fosse stata:

p {border-bottom: 1px solid #000;}

in quanto il selettore usato viene ignorato, e la regola diventa:

h1 p {border-bottom: 1px solid #000;}

Questa regola esprime una relazione di parentela falsa (false), e quindi Explorer 5 applica lo stile all'ultimo elemento che conserva per lui una parvenza di significato, ossia p. Il risultato è quello di avere una pagina con tutti i paragrafi con un bordo inferiore impostato. Per nostra fortuna questa sensibilità agli spazi sembra non essere stata ereditata da Explorer 6, che ignora completamente l'intero blocco di dichiarazioni.