IE 6 Ghost BUG

Siamo alle solite, caro Interent Explorer 6 neanche la pensione ti darei; oggi ho riscontrato un bug che fortunatamente nel WWW è stato già affrontato da altri designer.
Costantemente nei miei layout CSS utilizzo per il 90% le regole flotattiti per gli elementi, garantendo loro tutte le dimensioni necessarie e reali che a loro spettano.
Infatti il paramentro “float:” sui diversi browser renderizza a dovere i parametri ( height: width: padding: e margin: ) espandendo i vari box secondo il loro contenuto senza difetti di visualizzazione.

IE6 non si smentisce e anche con queste regole si inventa qualcosa se esageriamo, infatti capita che per i tag <div> o <li> se preceduti o nei pressi di un commento HTML ( <!– –> invisibile lato utente) IE6 crea di propria iniziativa un semi duplicato dell’ultimo elemento flottante, mostrando una ripetizione anomala del contento dell’elemento.

Per risolvere questo difetto:

• usare <!—[IF !IE]> attorno al commento
• rimuovere i commenti, soluzione più sensata, o nel caso di una pagina dinamica (.php) usare i commenti del codice appropriato al posto di quelli HTML
• nel flottante precedente aggiungere lo stile {display:inline;}
• aggiungere un margine negativo -3px all’ultimo elemento flottante prima del difetto
• drammaticamente inserire un display:none; per il contenuto difettoso

Nel mio caso lavorando su piattaforma Java ho rimpiazzato i commenti HTML con i commenti JAVA ( <%– –%> ) dissolvendo il BUG alla radice.
In altri casi ho risolto togliendo il float all’elemento difettoso inserendo un clear:both; andando così a pulire la ripetizione dei float.

Ecco l’articolo originale
Altre risorse: Link1, Link2