First, the page in question
http://www.stagen.com/staging/sitemap
I added the green border to highlight the problem. Firefox adds ~3px of top/bottom padding to the anchor elements. IE and Safari don't. The result is that the little background image ends up being misplaced.
Here's the CSS for the sitemap. Rules with a * are ones I added in attempt to nullify the glitch, which obviously fail.
Any clues?Code:div#sitemap { width: 583px; padding: 20px 0 20px 175px !important; } div#sitemap div.footer { bottom: -1px; } div.sitemapSection { width: 250px; float: left; } div.sitemapSection h2 { margin: 0;* padding: 0;* height: 11px; * } div.sitemapSection h2 img { margin: 0;* padding: 0;* } div.sitemapSection h2 a { margin: 0;* padding: 0;* overflow: hidden;* line-height: 11px;* border: 1px solid green; padding-left: 15px; background: transparent url(../images/icon_page.gif) no-repeat 0 5px; } div.sitemapSection h2 a:hover { background-image: url(../images/icon_page_red.gif); } div.sitemapSection li { list-style-type: none; list-style-image: none; position: relative; left: -25px; } div.sitemapSection ul a { padding-left: 15px; background: transparent url(../images/bullet_page_gray.gif) no-repeat 0 3px; } div.sitemapSection ul a:hover { background-image: url(../images/bullet_page_red.gif); text-decoration: none; }
P.S. This is Firefox .9.1 on the PC (WinXP)




Bookmarks