Center a container 1

[skiflyer]

This one seems simple, but it's leaving me scratching my head, and google is only turning up some convoluted examples.

Basically I have a div

#login_box
{
	background-color: #778899;
	width: 600px;
	height: 250px;
	border: 2px outset;
	padding: 10px;
	text-align: center;
	font-size: large;
}

And I want this centered on the page... I can't figure out what to put in the css to do this though.

If I just wrap the div in center HTML tags it does what I want, but I'd rather just do it in the CSS.

Am I just missing something obvious?

 

[Foamcow]

margin:0 auto;

And for IE, put

text-align:center;

in the surrounding block level element.
(you'll need to reset the text align to left within your box then)

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r

 

[skiflyer]

There is no surrounding block level element... it's the only div on the page.... but the first margin part alone seems to work in firefox & ie.

Huh, I'm giving CSS a -2 points for lack of intuitivness on such a simple idea.

Thanks.

 

[Foamcow]

There is no surrounding block level element

Yes there is. The body is a block level element. Your div is within that.

I don't think it's unintuitive to set margin:auto.

margin:0 auto;

What that says is set the top and bottom margin to 0 and set the left/right margins to be equal, occupying the available area on each side of the element.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r