[CSS] How to combine anchor tags w/o underlining images on hover

[DC]

Given:

a {
text-decoration:none;
}

a:hover {
text-decoration:underline;
}
Case #1

<p>
<a href="http://www.conservative.ca/">
<img src="images/logo_cpc_e.png" />
Conservative Party of Canada
</a>
</p>
Case #2

<p>
<a href="http://www.conservative.ca/">
<img src="images/logo_cpc_e.png" />
</a>
<a href="http://www.conservative.ca/">
Conservative Party of Canada
</a>
</p>

* markup simplified for clarity (I'm not an idiot }:O)
PROBLEM:

Same css for both cases. In case #1 (shared anchor tag), hover causes img to
be underlined along with the link text. Ugly. However, in case #2, img not
underlined on hover.

Why?

I don't want the unnecessary bloat from duplicating anchor tags. Can I
achieve this with css? What am I doing wrong? I'm sure it is something
simple but I can't suss it.

Thanks.

--
DC Linux RU #1000111011000111001

The word 'politics' is derived from the word 'poly', meaning 'many'
and the word 'ticks', meaning 'blood sucking parasites'.

[Mark Parnell]

Deciding to do something for the good of humanity, DC
<dc*****@myrealbox.com> spouted in
comp.infosystems.www.authoring.stylesheets:

Same css for both cases. In case #1 (shared anchor tag), hover causes img to
be underlined along with the link text. Ugly. However, in case #2, img not
underlined on hover.

That does seem odd. URL? What browser(s)?

--
Mark Parnell
================================================== ===
Att. Google Groups users - this is your last warning:
http://www.safalra.com/special/googlegroupsreply/

[Els]

Mark Parnell wrote:

Deciding to do something for the good of humanity, DC
<dc*****@myrealbox.com> spouted in
comp.infosystems.www.authoring.stylesheets:

Same css for both cases. In case #1 (shared anchor tag), hover causes img to
be underlined along with the link text. Ugly. However, in case #2, img not
underlined on hover.

That does seem odd. URL? What browser(s)?

Reproducable in Firefox (tested in v1.5). Only works as long as the
image is inline - float it and the image won't be underlined
However, if you look closely on case #2, hovering the image will show
the space between the image and the text underlined.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: At The Drive In - Cosmonaut

[Tony]

DC wrote:

PROBLEM:

Same css for both cases. In case #1 (shared anchor tag), hover causes img to
be underlined along with the link text. Ugly. However, in case #2, img not
underlined on hover.

Why?

I don't want the unnecessary bloat from duplicating anchor tags. Can I
achieve this with css? What am I doing wrong? I'm sure it is something
simple but I can't suss it.

Best I've ever been able to do is something like:

a {
text-decoration: none;
}

a span {
text-decoration: underline;
}

<a href="#"><img src="image.gif"> <span>Link text here</span></a>

Not all that great, & I'm certainly open to a better solution - but
that's what has worked for me in the past. Especially given that
Firefox underlines the whole link

Haven't tried it with the underline for hovers only, though.