Posted by DC on 12/31/05 21:37

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'.

• Next in forum: Re: Accessing This Group
• Prev in forum: Re: most popular website builder software?
• Thread view: [CSS] How to combine anchor tags w/o underlining images on hover

[Reply to this message]