开发者

Limit underline to the text

开发者 https://www.devze.com 2023-02-23 08:45 出处：网络

I\'d like to have the underline for the text only and at the same keep the image part of the link: <!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loo

相关专题：css internet-explorer-6 spacing text-decorations

I'd like to have the underline for the text only and at the same keep the image part of the link:

<!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>

The code result isn't the same in all major browsers.

Many thanks for any help!

Try this:

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>