Horizontal Menu 2nd Level Doesn't line up directly below first level in IE.

[jeffunk]

This is just a tip, so that I never have to debug this problem again.

The problem:
I have a horizontal menu with a top level and some menu items containing children, in Firefox everything is cool.  In IE the child menu items are shifted so that their menu item lines up starting directly in the middle of the parent item.  Not as planned.

Solution:
I had aligned the text in the parent level menu using

Code: Select all

text-transform:center;

in the CSS sheet.  I moved this line to apply only to the anchor items in the child level line items and added

Code: Select all

text-transform:left;

where it seemed appropriate. 

That fixed it.  That'll teach me for messing around in the section labeled

Code: Select all

/* Unless you know what you do, do not touch this */ 

[KO]

I never heard that you can use "text-transform:center;" or left. I thought it was "text-align:center" or left/right/justify