Hod Do I Center Div Tag?

How do I center a Div tag? I thought I just used something like the following:


HTML

<div class="main">
<h1>Title</h1>
</div>

Code (markup):

CSS

div.main {
float:center:
}

Code (markup):

 

body {
text-align: center; /* for IE */
}

div.main {
text-align: left; /* text align is inherited */
width: 500px;
margin-left: auto;
margin-right: auto;
}

 

Will that also center the rest of my site for any content within those div tags?

 

No. That won't center the stuff in the div tags, but you can do that by setting the text align to center and the left and right margins to auto.

Maybe if you have an example or something, and I can explain better. Maybe even code it for you

 

There's no such attribute as center for flow...
try assiging margin:auto; to the div tag and setting the width of the div layer...

.main {
margin:auto;
width:500px;
text-aligh:center;
}

Code (markup):

 

Ok. Rule number one. If you're using a complete and proper DOCTYPE, IE 6/7 will play by the rules and all that bloat won't be necessary.

Rule number two. Set a width on the DIV and then set the margins to 0 auto; (like so)

.main {
    margin: 0 auto;
    width: 750px;
}

Code (markup):

Problem solved. The trick that Magnus suggested is ONLY if you have to support IE 5 and 5.5 (unless you don't have a complete and proper DOCTYPE, in whcih 6 as well - but that can be cured by using one in the first place).

 

margin: 0 auto; as people have said is the way to go.
Also, a set width must be in place.