What happens when you have them as:
#archmen {
position: absolute;
top: 15px;
left: 650px;
}
#aboutmen {
position: absolute;
top: 35px;
left: 675px;
}
#contactmen {
position: absolute;
top: 50px;
left: 700px;
}
The container header div has enough height, although you have header defined twice in your CSS so try consolidating those.
Josh, you don’t need to relatively or absolutely position anything. Just put the links in a list and float the linklist to the right (which is where I assume you want it) and, if you want to put the list items so they’re somewhat at a diagonal over that black area, just give each li a different class with different padding/margin set. Make sure to set a width on your floated element. You may need to “clear” it by using a br after the floated element. If it needs more clearing than that, check here:
http://css-discuss.incutio.com/?page=ClearingSpace
I did try to view what you are trying to do, but IE seems to be showing something completely different. In IE the header color scheme is gray and the sidebar column is on the left, and in FF the header color scheme is green and the sidebar column is on the right.
Oh, and I did peek at the source code in the FF version, and there are some problems in the code. I ran it through the validator at w3.org and it’s minor stuff, but it should be straightened out. FF will always work better with clean code.
Kickass,
Thanks! I’ll try that. Is there any reason why what I was trying to do won’t work in FF? It works fine in IE.
Hm. I put a list in a div, which is set to float: right. The list does this in IE.
In FF, the list just sits as it would without the float: on the far left side of the header area, with a slight indent.
Also, I cleaned up the validation errors. The only one that I don’t get is the one that says that I have a li item without a ul / ol. When I ADD a ul, it just generates MORE validation errors.
