IE Rollover Problem

Here's a weird thing I encountered yesterday. I'm trying to do a simple list-based rollover menu. However, for some reason in IE each item has a two pixel gap between it and the next, despite the fact that in the CSS border-bottom is set to 1px. See example one.

When I change the font from Arial to Trebuchet MS, however, the problem goes away! See example two. The only thing I've changed is the font-family. This doesn't make any sense, does it?

Any help would be much appreciated.

Posted on: April 13, 2004 | 2 Comments

Recent Entries in "Web Design"

2 Comments Posted

I wonder if there is a different, inherent line-height associated with each font. Therefore, I wonder if reducing line-height for Arial would solve the extra space.

I hadn't thought of that. I'll give it a try and see what happens. Thanks!


Subscribe to my RSS FeedSubscribe to my Web Design Blog RSS Feed


Proud member of 9rules network