verosimile.it

Esperimenti CSS

Internet Explorer 8 e la sua curiosa gestione della sottolineatura negli heading linkati che contengono un bold

Internet Explorer: nuova versione, nuovi bachi!

Immaginiamo di avere un titolo, per esempio un h4 (il quale abbiamo stabilito via CSS che non deve essere in grassetto) linkato che contiene una parte in bold. Se il link lo vogliamo sottolineato, la sottolineatura non dev’essere in grassetto, giusto?
Per capirci, questo è ciò che ci aspettiamo di vedere:

E infatti è quello che ci viene presentato da tutti i browser. O meglio: da tutti i browser tranne uno. Ecco infatti come Internet Explorer 8 gestisce l’elemento:

Come possiamo vedere, l’ultimo browser di casa Redmond, in presenza di un titolo linkato con dentro un bold, bolda anche la sottolineatura. Comportamento che nemmeno i suoi eccentrici predecessori si sognavano di avere.

Ma non è tutto. Guardate un po’ come IE 8 gestisce il medesimo elemento in presenza di meno testo boldato:

Ora la sottolineatura non è più boldata (uniformandosi all’interpretazione di tutti gli altri browser).
Cos’è successo? Semplice: in questo esempio la parte del titolo linkato in bold è minore di quella non in bold.
Quindi abbiamo scoperto che IE 8 decide di boldare o meno la sottolineatura di un titolo con dentro un link che a sua volta contiene un tag “b” (o “strong”) facendo un calcolo tra il rapporto di testo in grassetto e di testo normale. Se il testo in grassetto è maggiore di quello normale, la sottolineatura sarà boldata, e viceversa.