http://www.freewebs.com/lizasheni/index.htm

I'm quite new to css and I decided to do my layout using css since everyone says css is da bomb!!

Anyways, I thought I was managing alright until the whole relative positioning of text really screwed me up.. so if you could please look at the page and the code and tell me how to fix it so that the main content text and the sidebar text are on the same level from the top that would be great!!!!
Cuz whenever I add more text, the positioning of text in the side bar changes because it is relative positioning.. but I don't know how else to position it so that is fits accordingly with the centered layout... Get my drift?

Thanks, I'll be thinking about you in my dreams...
Just kidding! haha!

Modify your #content and #navigation selectors like this ~

#content {
float:left;
position: relative;
margin:0;
top:120;
left:61;
width:635px;
}

#navigation {
float:left;
position: relative;
margin:0;
top:120;
width:150;

}

This sets up a two-column layout. The content column is 635 px wide (you should use "px" in your css) and floats to the left of your navigation column.

If you want to center the page in Firefox and Opera, alter the container div -
margin: auto

Actually, it would be better NOT to position EVERY single div.. and that is exactly want most CSS newbies do. It is not necessary, learn to use the normal document flow and position ONLY where you absolutely have to.

ADD position: relative to your #container, and REMOVE it from everything else, it's not needed.

Also, in order for ANY of this to work properly you need to add a proper DOCTYPE and I would recommend at least HTML 4.01 STRICT. Without a doctype, everything renders in quirks mode -- not good.

You also have navigation AND content sitting inside your header. I suspect this is NOT what you really want to do. If you want the navigation inside the header area, leave it there, but content should be OUTSIDE the #header area -- since it's NOT a header.