Miguel A. Friginal 07 апреля 2011 42

Ограничить подчеркивание текста

Miguel A. Friginal / 07 апреля 2011

Мне бы хотелось, чтобы подчеркивание было только для текста, и в то же время сохраняло часть изображения ссылки:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<title>Test</title>

<style type="text/css">
a:hover {text-decoration:none;}
img {border:none; vertical-align:bottom; padding-left:15px}
</style>

<a href="#">Subscribe to feed<img src="http://www.google.com/phone/static/images/feed-icon.gif" alt=""></a>

Результат кода не одинаков во всех основных браузерах.

Большое спасибо за любую помощь!

Ответы [ 2 ]

drudge / 07 апреля 2011

Попробуйте это:

Live Demo

<style type="text/css">
    a, a:hover span { text-decoration:none; }
    a span { text-decoration: underline; }
    a img {
        border: none;
        vertical-align: bottom;
        padding-left: 15px;
    }
</style>

<a href="#">
    <span>Subscribe to feed</span>
    <img src="http://www.google.com/phone/static/images/feed-icon.gif" alt="">
</a>

...