Souligne ie6-bug. élément en ligne dans <a> tag

Question

Il y a un balisage:

<a href="#"> 
    lorem ipsum<span>15</span> 
</a> 

Il y a des styles:

a{ 
    text-decoration: underline; 
} 

a span{ 
    background: #fff; //To clean the bottom underlining under <span> 
} 

Works dans tous les navigateurs me intéressants. Sauf IE6. Le soulignement inférieur sous <span>reste.

Comment résoudre ce problème sans changer un balisage.

---

a span{ 
    text-decoration: none; 
} 

ne fonctionne pas.

Answer 1

pourquoi ne pas essayer?

a span{ 
    background: none; 
    text-decoration: none; 
} 

Je crois que cela fonctionne pour tous les navigateurs?

---

Essayez d'ajouter background: none; à la balise CSS existant comme indiqué ci-dessus. Je vais essayer de voir si je ne peux pas obtenir cela pour travailler sur IE6.

Answer 2

Cela pourrait-il fonctionner?

a{ 
    text-decoration: underline; 
} 

a span{ 
    background: #fff; //To clean the bottom underlining under <span> 
    text-decoration: none; 
} 

Answer 3

Pour ajouter à la réponse Gentleman Elite: Utilisez une instruction conditionnelle (preféré) ou le hack underscore pour cibler IE6 seulement:

a span { 
    _text-decoration: none; 
} 

Answer 4

Essayez de changer votre CSS à ceci:

a span { 
    background: #fff; 
    display: inline-block; 
} 

Malgré ce que les autres ont posté, text-decoration: none; ne fonctionne pas.