Posted by Toby A Inkster on 04/18/07 08:03

Jon Slaughter wrote:

> ul li a:hover
> {
>
> }
>
> Then the style references everything in a. is there any way to tell it to
> reference li instead?

No, but you have two options:

ul li:hover
{
/* Styles go here.
* However, there is no way of knowing whether the <a> element
* is also being hovered. The cursor might be over the <li> but
* not over the <a>. If you want the <a> to fill he entire area
* of the <li>, then set it to display:block;height:100%;
*/
}

Or attach a small Javascript function to the onmouseover/onmouseout events
for the <a> element which toggles the class of its parent element.

--
Toby A Inkster BSc (Hons) ARCS
http://tobyinkster.co.uk/
Geek of ~ HTML/SQL/Perl/PHP/Python*/Apache/Linux

* = I'm getting there!

[Back to original message]