display: block style issue in IE (and not on other browsers)

[dee]

Here is a a list of my hyperlinks in my home page:

<A class="theclass" href="Default.aspx">Home</A>
<A class="theclass" href="Search.aspx">Search</A>
<A class="theclass" href="Help.aspx">Help</A>

And these are defined in Styles.css file:

a.theclass:link, a.theclass:visited {
display: block;
border: 1px solid #cccccc;
text-decoration: none;
}
a.dpclass:hover{
border: 1px solid #cccccc;
text-decoration: none;
}

Now, the problem is that in FireFox/Netscape and Opera when the mouse cursor
enters the style box of the hyperlink (due to display:block style) the box
changes color. However, in IE6.0 the box only changes color when the mouse
cursor is on the text of the hyperlink and entering into the box alone
produces no visual effect. I appreciate if anyone who has run into this
issue has a solution or anyone else has a suggestion about this.

Thanks.
Dee

 

[Bruce Barker]

to handle this on ie, use the mouseover and mouseout events to change the
style rather than hover.

-- bruce (sqlwork.com)

 

[dee]

Bruce, for that I have to use client side script, no? The spec is not to use
any scripts.
Thanks

 

[dee]

Actually this is laid out vertically:

<tr><td>
<A class="theclass" href="Default.aspx">Home</A>
</td></tr>
<tr><td>
<A class="theclass" href="Search.aspx">Search</A>
</td></tr>
<tr><td>
<A class="theclass" href="Help.aspx">Help</A>
</td></tr>

The horizontal layout doesnt have a problem az the boxe sizes are determined
by the hyperlink text.