IE Blues: Absolute positioning inside relatively-positioned parent isn't working

[AaronW]

Oh IE, if only your mother hadn't been experimenting with drugs during your incubation... http://www.offtone.com/v2/

My menu is properly positioned in Gecko, but IE assumes that position: absolute refers to the body element and not the div#header in which #menu resides, which is positioined relatively.

The CSS for my menus positionining:

#header { position: relative; }
...
#menu {
  position: absolute;
  right: 0;
  bottom: 0;
  list-style-type: none;
  margin-right: 22px;
  margin-bottom: 6px;
}

Thanks for any ideas for getting IE to put my menu where it belongs,
Aaron

[mindlessLemming]

Mmmm...
Ok, not what you _want_ to do, but it will work...
Absolutely position your header and menu; use body-padding-top to push content clear of the header and the page will continue to flow as normal.

[AaronW]

Ah, but if I use that method, any font scaling will screw up the menu. I'm pretty sure I need to use the bottom property.

Either that or I'll have to decide on a new style for the menu

[mindlessLemming]

Originally Posted by AaronW

Ah, but if I use that method, any font scaling will screw up the menu. I'm pretty sure I need to use the bottom property.

Bleh? I think you misunderstood me...
Leave the menu positioning exactly how it is. Apply position:absolute; to the header div so that it's child elements won't bug out when ab.pos.
Now the menu and header should be right, but the content will start up underneath them. Add up the height of the header + its top and bottom margins and set this value as 'padding-top' on the body or containing div, depending on what method you're using. This will push the content clear of the header and the page will look and function the same as it does now.
Here's the code changes you would make:

#header {
  position: absolute;
  top:15px;
}

and then add

padding-top:95px;

to the body CSS.

There's always more than one way to skin a cat

[AaronW]

Oh right. I guess IE doesn't break when the parent is absolutely positioned. That's the bit I needed to know :P

Thanks.

[AaronW]

Ah, super. Worked a charm. Guess I'll have to start thinking even futher out of the box... Yeesh.

[mindlessLemming]

Of course it worked
(I checked first!)