Remove white background from Category nav IE

Keely · #1 04-21-2010, 05:51 PM

I can't get rid of a white background that is appearing in IE but not in Firefox:

Website: http://www.whatsinthejewellerybox.com

Look at left navigation - Categories.

List is in a white box (in IE)

Should have background colour of #fce640 and a white hover (OK in Firefox)

balinor · #2 04-22-2010, 04:28 AM

Use Firebug to see what css class is causing it:

http://getfirebug.com/

cflsystems · #3 04-22-2010, 04:30 AM

Could be one of the IExx.css files. They do not apply to FF so you don't see it there

Keely · #4 04-22-2010, 07:10 AM

Quote:

Originally Posted by cflsystems

Could be one of the IExx.css files. They do not apply to FF so you don't see it there

Thanks - will check that out. Didn't think of that.

Keely · #5 04-22-2010, 07:13 AM

Quote:

Originally Posted by balinor

Use Firebug to see what css class is causing it:

http://getfirebug.com/

Yep - got Firebug. Always use it.
Useless in IE though, so needed a fresh perspective on it and came here.

In future I will say I have Firebug. I use it CONSTANTLY.

gb2world · #6 04-22-2010, 12:45 PM

You can use the developer toolbar with IE - it is not as nice as firefox, but it can be very helpful.

I took a look using the developer toolbar in IE8 and changed this:
main.IE7.css
.fancycat-icons-e UL LI from white to #fce6fo
and the pink background with white mouse overs seems to work now

Also - firebug is far from useless, even when looking at problems with IE. If it works in one browser and not another, you can compare the differences, and you need the best available tools in each to trace browser differences.

Keely · #7 04-22-2010, 02:55 PM

Thanks for your help.
I forgot about the styling in the modules

/modules/Flyout_Menus/Icons/main.IE7.css

Thanks again

Keely · #8 04-22-2010, 03:08 PM

Quote:

Originally Posted by gb2world

You can use the developer toolbar with IE - it is not as nice as firefox, but it can be very helpful.

I took a look using the developer toolbar in IE8 and changed this:
main.IE7.css
.fancycat-icons-e UL LI from white to #fce6fo
and the pink background with white mouse overs seems to work now

I fixed the background, but now the ul li ul is cut off at the right

Any ideas with this? I'm not good at IE bugs !

gb2world · #9 04-22-2010, 03:44 PM

I'm not sure I understand what you are trying to change, but here is something that causes differences in the appearance of your mouseovers:

in FF:
main.css
.fancycat-icons-e ul width 150px

in IE8:
main.IE7.css
.fancycat-icons-e ul width 127 px

Probably should heed the advice given you above by Steve about looking at the IE css files, Any changes you made to main.css might also need to be accounted for in the IE files. Rather than just looking at the code - I find it easier to use IE developer tools and compare directly with what you see in firebug to get to the differences quickly.