Chiunque abbia sviluppato un qualunque sito di media complessità si sarà reso conto che il risultato prodotto risulta (talvolta leggermente, talvolta notevolmente) diverso a seconda che si visualizzino le pagine web con Internet Explorer o Firefox (per limitarci ai browser più popolari).
Come noto a tutti gli sviluppatori di siti web, infatti, i diversi browser in circolazione (purtroppo!) non interpretano il codice CSS allo stesso modo.
Fino a poco tempo fa gli sviluppatori più attenti, al fine di creare siti cross-browser, erano soliti ricorrere ai cosidetti hack, dei semplici “trucchetti” basati su dei bug di Internet Explorer nella gestione del codice, grazie ai quali era possibile scrivere (grazie a particolari accorgimenti) diverse istruzioni nei CSS che sarebbero state eseguite e/o ignorate a seconda che il browser utilizzato fosse IE o altro.
Ultimamente sempre più web designer ricorrono ad una tecnica più pulita ed efficace: icommenti condizionali.
A differenza degli hack accennati sopra, i commenti condizionali non si basano su dei bug di un dato browser, bensì sono un nuovo ed efficace strumento di controllo condizionale integrato all’interno di Internet Explorer.
E’ ormai tecnica diffusa quella di fornire un foglio di stile diverso a seconda della versione di Explorer individuata.
Proponiamo una tecnica tanto semplice quanto geniale per individuare con semplicità la versione di Internet Explorer in uso e assegnare di conseguenza una classe custom al body del nostro HTML.
Ci basterà infatti aggiungere questo commento condizionale nel nostro HTML (subito dopo la dichiarazione del doctype) per assegnare una classe specifica in base alla versione di Explorer:
<!--[if lt IE 7 ]> <body class="ie6"> <![endif]--> <!--[if IE 7 ]><body class="ie7"><![endif]--> <!--[if IE 8 ]><body class="ie8"><![endif]--> <!--[if IE 9 ]><body class="ie9"><![endif<]--> <!--[if (gt IE 9)|!(IE)]><!--><!--<![endif]-->
Fatto ciò non dovremmo far altro che riprendere nel CSS la dichiarazione che “scoppia” aggiungendo la classe specifica di IE e correggere il tiro!
Lascia un commento