Hi all,

I'm trying to create a list in which each "li a" has a background image which changes 
color with "li a:hover".

I've gotten that to work, but am having trouble getting them to look the same 
in both IE6-PC and FF 1.0.3.

Here's the file I'm working on:

http://pandasteak.com/humu/essays/cross-browser-problem.html

If you compare the two in IE and FF you'll see the difference: There seems to be a 16px 
gap between the "li a" elements in IE, none in FF.

It's visible when there's a background color applied to the "li a" element:

http://pandasteak.com/humu/essays/cross-browser-problem-red-anchor.html

I did a test with the background color on the "li" alone, just to be sure it was the 
"a":

http://pandasteak.com/humu/essays/cross-browser-problem-red-li.html

What the heck is going on?

I'm also noticing that in IE the "li" extends to the right margin beneath my 
float, whereas in FF it does not.

I've experimented a lot with margin and padding on the different elements, but 
to no avail.

Generally, as I experimented all that happened was a loss of control over the 
positioning of the background image.  That was a hassle.

Thanks in advance for any help you all offer.

John

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to