Reply
Page alignment in IE
Old 02-17-2006, 11:12 PM Page alignment in IE
Novice Talker

Posts: 10
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
lynnp08 is offline
Reply With Quote
View Public Profile
 
When You Register, These Ads Go Away!
Old 02-18-2006, 03:01 AM Re: Page alignment in IE
vangogh's Avatar
Post Impressionist

Posts: 8,923
Name: Steven Bradley
Location: Boulder, Colorado
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.
__________________
l Search Engine Friendly Web Design | Van SEO Design
l Tips On Marketing, SEO, Design, and Development | TheVanBlog
l Custom WordPress Themes
| Small Business Forum
vangogh is offline
Reply With Quote
View Public Profile Visit vangogh's homepage!
 
Old 02-18-2006, 10:18 AM Re: Page alignment in IE
Novice Talker

Posts: 10
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
lynnp08 is offline
Reply With Quote
View Public Profile
 
Old 02-18-2006, 02:09 PM Re: Page alignment in IE
vangogh's Avatar
Post Impressionist

Posts: 8,923
Name: Steven Bradley
Location: Boulder, Colorado
Looks like you got it all working Lynn. I'm seeing everything centered in both Firefox and IE. Glad I could help.
__________________
l Search Engine Friendly Web Design | Van SEO Design
l Tips On Marketing, SEO, Design, and Development | TheVanBlog
l Custom WordPress Themes
| Small Business Forum
vangogh is offline
Reply With Quote
View Public Profile Visit vangogh's homepage!
 
Old 02-25-2006, 10:21 PM Re: Page alignment in IE
Novice Talker

Posts: 10
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! :-)
lynnp08 is offline
Reply With Quote
View Public Profile
 
Reply     « Reply to Page alignment in IE
 

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off




   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML

 


Page generated in 0.12627 seconds with 12 queries