Nie myślałem, że Arkusze Kaskadowe Stylów jeszcze kiedykolwiek zaskoczą mnie... a już na pewno nie w taki sposób - elementami, które są podstawą i które znam od wielu, wielu lat.
Pomóżcie, bo nie rozumiem tego totalnie. Wydaje się, że prostą strukturę, którą napisałem, Trident wyświetla poprawnie (wg mojego rozumowania) a ani WebKit, ani Gecko, ani Presto nie potrafią tego zrobić. (Tak, wiem, że to przecież nawet brzmi śmiesznie! Wychodzi na to, że czegoś nie rozumiem.)
Chodzi o text-decoration w poniższym przykładzie:

<style> a, a:link {color: black; text-decoration: none;} a:hover {color: red; text-decoration: underline;} b.hide {display: none;} a:hover b.hide {color: green; text-decoration: none; display: inline;} </style> <a href="http://g.cn"> Odnośnik widoczny <b class="hide"> (część ukryta) </b> </a>
Który daje następujący efekt:

Odnośnik widoczny (część ukryta)

Mam więc niepodkreślony odnośnik - rodzic, który jest widoczny i ma kolor czarny. We wnętrzu mamy dziecko klasy "hide" - dodatkowy element <b> (pierwszy lepszy jaki mi się nasunął) dalsza część odnośnika, niewidoczna (display: none).

Po najechaniu kursorem na link oczywiście rodzic nabywa pseudoklasę :hover zmieniając swoje właściwości: tekst całego linku zmienia kolor na czerwony i dostaje podkreślenie (text-decoration: underline;) oczywiście również czerwone, bo tak działa CSS. Dziecko o klasie hide jest wyświetlane (display: inline), nadawany jest mu INNY kolor - zielony, i usuwane jest podkreślenie ( text-decoration: none;).

Więc dlaczego, do cholery, wszystkie zgodne ze standardami przeglądarki wyświetlają mi to źle! Co prawda wyświetlają pogrubione dziecko <b> o klasie hide, zmieniają jego kolor poprawnie na zielony, ale całkowicie olewają atrybut text-decoration: none;
i na chama wyświetlają czerwone podkreślenie.

Natomiast jedyny Trident wyświetla mi to tak, jak ja chcę, żeby się wyświetlało.
Czyli BEZ podkreślenia w tym elemencie, który kaskadowo dostaje atrybut text-decoration: none;

O co w tym chodzi?

Co prawda rozwiązanie jest dosyć proste i działa na wszystkich silnikach:
<style> a, a:link {text-decoration: none;} a span.visible {color: black; text-decoration: none; } a:hover span.visible {color: red; text-decoration: underline;} b.hide {display: none; } a:hover b.hide {color: green; display: inline; } </style> <span> <a href="http://g.cn"><span class="visible"> Odnośnik widoczny</span> <b class="hide"> (część ukryta) </b> </a> </span>
Tekst - odnośnik, który ma mieć podkreślenie - obejmujemy dodatkowym znacznikiem <span> i to pod nim ustawiamy text-decoration: underline;, podczas najechania kursorem, natomiast na całym linku całkowicie wyłączamy podkreślenie text-decoration: none;

Smutne, ale prawdziwe.