center horizontal and vertically

**stephan.gerlach** · 10-02-2006 07:14 AM

how do i center a div right in the center of the screen horizontally and vertically purly using css

**KDLA** · 10-02-2006 08:37 AM

To center horiz.:

Code:

body {text-align: center;}
#wrapper {margin: auto 0; padding: 0; text-align: left;}

**stephan.gerlach** · 10-02-2006 08:46 AM

hmm i must do something wrong. its not working for me. not in ie and not in firefox

used this code

HTML Code:

<body>
<head>
<style>
body {
	text-align: center;
}
#wrapper {
 	margin: auto 0; 
	padding: 0; 
	text-align: left;
}
</style>
</head>

<body>
<div id="wrapper">
test
</div>
</body>

**KDLA** · 10-02-2006 08:52 AM

Whoops - I missed something.... you need to place the width in the wrapper.

Code:

<style type="text/css">
body {
	text-align: center;
}
#wrapper {
width: 600px; 	
margin: auto 0; 
	padding: 0; 
	text-align: left;
}
</style>

You can change that value to whatever you want.

**stephan.gerlach** · 10-02-2006 09:09 AM

still not working. the text is always at the top right corner. in firefox right at the side and in ie its a little bit away from the right side.

any ideas why?

**KDLA** · 10-02-2006 10:20 AM

Hmmmm..... Might be easier for you if you consulted here: http://www.maxdesign.com.au/presentation/center/

**Kravvitz** · 10-02-2006 10:30 AM

That still only addresses the horizontal. This addresses both: Center Page Content Horizontally and Vertically (without <table>s)

**Rezon** · 10-02-2006 02:51 PM

Use the link above. But as for the previous regarding Horizontal rule. You had margin: auto 0; when it should read margin: 0 auto;

Thread: center horizontal and vertically

Thread Tools

Display

center horizontal and vertically

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions