13Apr2004
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"
- Forbes Doesn't Care About the User Experience (0)
- Easily Create iOS and Android App Store Badges (0)
- 15 Online Tools for Creating Great Content Ideas (1)
- Web Design Trends to Help You Spring Clean Your Resumé (7)
- Looking to Hire an Email Marketing Manager (0)
- Create Awesome Article Headlines in Seconds with the Content Idea Generator (23)
- Two Great Guides to SEO for Large Websites (1)
- Lessons Learned from Launching an Online Store on Magento (1)
- Pagination Design Showcase (0)
- Best Practices for Writing Email Subject Lines [Infographic] (0)
- 30 Call to Action Examples that are Better than Learn More (5)
- 50+ Examples of Highly Optimized Landing Page Design (24)
- Components of a Great Website Footer (0)
- Login Form Showcase: 65+ Examples of Login Form Design (0)
- CSS Rounded Corners 'Roundup' (65)
- Using a Background Image Grid to Lay Out Your Web Site (43)
- Typography for Headlines (20)
- How to Get a Job in the Web Industry (24)
- How to Create a Block Hover Effect for a List of Links (32)
- How to Write a Web Site Creative Brief (6)
- Don't Make Me Think: A Common Sense Approach to Web Usability
- Web ReDesign 2.0: Workflow that Works
- White Space is Not Your Enemy: A Beginner's Guide to Communicating Visually through Web Design
- Basics of Web Design: HTML5 and CSS3
- Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement
- Prioritizing Web Usability
- The Web Designer's Idea Book: The Best Themes, Trends and Styles in Website Design
- The Principles of Beautiful Web Design
- Convert!: Designing Web Sites to Increase Traffic and Conversion
- HTML and CSS: Design and Build Websites
- View more recommended reading…
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.
1. Posted by Tim McElwee on April 27, 2004
I hadn't thought of that. I'll give it a try and see what happens. Thanks!
2. Posted by Christian on April 28, 2004