Microsoft invita a ripulire gli hack CSS

Un recentissimo post su IEblog lancia un invito:

Stiamo cominciando a notare i primi siti e le prime pagine "rotte" a causa dei fix CSS che abbiamo apportato. Vorremmo chiedervi il vostro aiuto nel fare pulizia degli hack CSS
nelle vostre pagine per IE7.

Il messaggio è molto chiaro: se avete usato hack o workaround preparatevi a rimuoverli perchè gli effetti con IE7 potrebbero essere disastrosi. Insieme ai molti bug risolti, IE7 avrà  infatti un maggiore supporto dei selettori CSS 2.

Regole CSS mirate per browser standard da una parte o per IE5.x e IE6 dall'altra che fanno uso dei seguenti selettori:

• html > body
• * html
• head:first-child + body
• head + body
• body > element

potranno dare problemi di resa su IE7. Il condizionale è d'obbligo: una
certa classe di hack e workaround per IE5.x e IE6 sarà  ancora possibile ed auspicabile se IE7 avrà  un'aderenza ai CSS pari a browser quali Opera, Firefox o Safari e non soffrirà  dei frustranti bug di IE fino alla versione 6.

In ogni caso, come ho detto in un mio precedente post su IE7, passerà  del tempo prima che venga rilasciata una versione stabile di IE7 e che una percentuale significativa di utenti lo usi.

Niente allarmismi né fretta quindi: cercare di sistemare le cose oggi e mantenere una buona resa su IE5.x e IE6 senza prima avere la possibilità  di riscontro
su IE7 è come voler gridare all'epidemia e voler sviluppare una cura per una malattia
ancora sconosciuta.

Il consiglio migliore che mi sento di dare riguarda la profilassi: per i vostri progetti correnti e futuri limitate al minimo l'uso di hack e workaround e testate le vostre pagine oltre che su IE5.x e IE6 anche su browser un po' più moderni come Opera, Firefox o Safari. E se proprio dovete usare regole specifiche per IE5.x e IE6 il
commento condizionale potrebbe essere la soluzione meno dolorosa. Le seguenti tre righe nella sezione head delle vostre pagine serviranno un CSS specifico per IE fino alla versione 6 compresa:

<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="ie.css">
<![endif]-->


In conclusione rimando agli articoli sulla risoluzione dei problemi CSS
(primo,
secondo e
terzo) e al mio articolo
in inglese CSS design for the future
per approfondimenti e link su come affrontare problemi di resa sui vari browser.