Hi folks,

I'm sure this is a common question. I'm fairly new to CSS. Trying to learn all I can, but I am stumped. I have made a page on which I want the content of the page to be centered in the browser window. I was able to accomplish this with the header on the page, but everything under the header, displays off to the right in IE browsers on both MAC and PC. (it looks correct in Firefox and Safari on the mac and Firefox on the PC.) I've been trying different things for days and don't know which way to turn at this point. I did get it to work on IE for the Mac at one point, but it was still broken on IE on the PC. Everything below the header is lining up under the div which floats to the right in the header. I know this must be a clue, but I'm still stumped.

Without further ado, here is the link to the page and the stylesheet. The rest of the site is a mess because I'm just trying to get this layout down before I adjust the other pages (and those are using a different stylesheet which I've fiddled with extensively.)

The troublesome page: http://www.websolutionsbylynn.com/rick/about.1.html

STYLESHEET: http://www.websolutionsbylynn.com/rick/stylesheet2.css

I did validate my html and css on this page last night.

I hope someone can give me some pointers.

Lynn

Lynn I think it might be a combination of how you're using align="left" on multiple divs within the page and that you're mixing absolute and relative positioning on some of the divs.

The way I usually center a page is to wrap everyting in one div which I typically call page and then use the following css:

div#page {width:775px; margin:0 auto}

I used the width you're using and the margin values are a shortcut that basically says no margin on the top and bottom and to let the browser automatically give a margin to the left and right. The left and right margin will end up being the same and the page div will be centered in the browser window.

If you do that you'll need to remove the align="center" divs and won't need all the positioning you used on the various divs. You can still use the postioning, but you may want to keep them all as absolute positioning and your values for top and left will probably need to be adjusted.

Thank you so much vangogh! I am going to give your suggestion a try now. I'll be glad to get rid of all that positiioning!

Lynn

Looks like you got it all working Lynn. I'm seeing everything centered in both Firefox and IE. Glad I could help.

Hi vangogh,

YES! I did get it working! Thank you so much! I really appreciate it. I have another css question which I'm getting ready to post in a new thread. Feel free to jump in on that one too if you know the answer! :-)