Io e l'italic bug

Mi sono imbattuto nell'italic bug mentre stavo realizzando una pagina come questa. La pagina realizzata all'epoca aveva un codice leggermente diverso, ma tuttavia rispondeva a due requisiti fondamentali:

All'epoca ho usato un codice leggermente diverso per Internet Explorer. Il codice era il seguente:

/* IE6 */
em, cite {position: relative; zoom: 1; }

/* IE5.x */
/*\*/ * html em, * html cite {
height /*\*/: 0;
vertical-align /*\*/: middle;
line-height /*\*/: 100%;
}

Il codice, dato con un commento condizionale, agisce direttamente sugli elementi con stile italic, e non sul loro contenitore. Parlando con Bruno, mi sono accorto che questa soluzione va bene quando nel testo ci sono solo poche parole isolate in italic, e non quando vi sono interi blocchi di testo.

NOTA: le proprietà 'vertical-align' e 'line-height' sono state date ad IE5 per ripristinare l'altezza originaria della riga, che si era persa con la dichiarazione 'height: 0'

Comunque sia, nella pagina che vi ho mostrato poc'anzi la soluzione riportata sopra non funziona. Inoltre, sempre in questa pagina, ho fatto in modo che il testo in italic occupasse un intero paragrafo (quello con sfondo giallo), con margini e padding settati a zero. Nonostante questo, ho leggermente modificato la soluzione di prima e l'ho adattata come segue:


* html .last em {
overflow: visible;
position: relative;
zoom: 1;
}

In questo caso è evidente il fatto che io abbia letto l'articolo di Bruno, cosa che non avevo fatto in precedenza. Tuttavia, applicando questa soluzione direttamente all'elemento em, ho un perfetto risultato in IE6 e 5.5, ma nessuno in IE5.0. I limiti di questa tecnica alternativa sono evidenti: IE manda a capo un'intera parola prima della fine del paragrafo (cosa che io ho vigliaccamente mascherato eliminando un punto che finiva a capo). Quindi, se volete usarla, assicuratevi che vi siano solo parole isolate in italic e non interi blocchi di testo.

Gabriele Romanato