homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

Centering DIV in a page
What's the best option to align DIV in a center of a page?

 3:37 am on Jul 8, 2004 (gmt 0)

What's the best option to align DIV in center of page so people with different monitor resolution still be able to view the page properly in a center?



 3:43 am on Jul 8, 2004 (gmt 0)

Two of the options:

#div {margin:0 auto;}

This doesn't work with the older versions of IE, I think 5 and lower.

#divWrapper {margin:0 auto; text-align:center;}
#div {text-align:left;}

I have enough IE5 users, so I use the second one with no problems.



 6:28 pm on Jul 8, 2004 (gmt 0)

what do you mean by

#divWrapper {margin:0 auto; text-align:center;}
#div {text-align:left;}?

I need to center the content div in a page. just like we do with table align="center". How do I get that in CSS?

Thanks for the help!


 7:14 pm on Jul 8, 2004 (gmt 0)

RAmmstein just told you. The ...

margin: 0 auto;

...does it in modern, compliant browsers, setting left and right margins to equal amounts based on how wide the stuff in the middle turns out to be. For IE browsers...

text-align: center;

...usually does it. Combine those two into the same rule and you're covered for almost all cases.

I usually put the margin: 0 auto on the body element to center all the stuff on a page, but it doesn't always cascade right so sometimes it has to be placed on specific containing divs to make the magic happen.


 7:54 pm on Jul 8, 2004 (gmt 0)

Another solution that seems to work is to use xhtml 1.0 strict declaration (not sure if 1.1 or transitional works...I have only tried with 1.0 strict).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />


 8:05 pm on Jul 8, 2004 (gmt 0)

Jennifer, excellent second option there. Looks like I have a new default thanks to you. I'm anxious to have a look on other browsers. :)

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved