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.