newbie: How do you horizontally center (align) a div ?

[amakeler]

Hi all, Subject: newbie q: How do you horizontally center (align) a div ?I have looked thru all the CSS commands, but for some reason I could not seem to find a command to horizontally center (align) a <div>. I have taken somebody's good advice to put all my content in some sort of #content div, but now I have decided to make the content a certain width, say 900px, I can't find a way to center the #content div in the center of the browser window.So surely there must such a command? Thinking...or maybe not, coz every time somebody widens the browser the whole content will have to jump.Anyway...need help.avraham

[real_illusions]

its pretty simplein your css you need#content{margin: 0px auto;width:900px;}the #content been the id of the div that is the main one encasing all your content.

[S@m]

Great example how to center your layout. Super easy.http://www.simplebits.com/notebook/2004/09/08/centering.html

[real_illusions]

you shouldn't need the text align attribute for the body.As saying text-sling:left; in every other element means extra bytes to d/l from the css, a bit useless in my opinion, And it says on that site that its for ie5 for windows. Who the heck uses ie5 nowadays?

[croatiankid]

you shouldn't need the text align attribute for the body.As saying text-sling:left; in every other element means extra bytes to d/l from the css, a bit useless in my opinion, And it says on that site that its for ie5 for windows. Who the heck uses ie5 nowadays?

Yeah since IE7 came out I've completely disregarded support for ie5.By the way, if you're being so nitpicky about extra bytes....

#content

#id{margin: 0px auto;width:900px;}

can be

#id{margin: 0 auto;width:900px;}

[jesh]

By the way, if you're being so nitpicky about extra bytes....can be

#id{margin: 0 auto;width:900px;}

Why not:

#id{margin:0 auto;width:900px;}

then?

[BiteMe]

one other thing. Dont call yourself newbie.Y would you do that? No one calls themself newbie.....newbie

[otenjoxi]

If you're having any issues in IE 6 or below, try this:body{ text-align: center; /* ie fix */}div#wrapper{ text-align: left; /* fixes the ie fix */ margin: 0 auto; width: 750px; /* must have a width or it defeats the purpose */}

[otenjoxi]

An example situation would be if you wanted to center a wrapper div that was a direct descendant of the body.