CSS Forum

**max196** · 12-04-2008, 12:40 PM

Hi friends,

I am building my website templates compatible for any resolution ranging from 800x600 to maximum possible resolution. I want to place all the body content exactly in the center (900px layout).

I have set the background exactly in the center. but when i am inserting the content, it is displayed from left. How should i set it in the center?

please help me!

**Insensus** · 12-04-2008, 12:44 PM

Wrap everything in a container div with style="margin: 0 auto;" should work.
Edit: The div should have a fixed width or else it'll be 100% width and you still won't see anything centered. :P

**aldor** · 12-04-2008, 02:48 PM

Read the stickies.

**LadynRed** · 12-04-2008, 03:43 PM

http://www.webmaster-talk.com/css-fo...r-website.html

**max196** · 12-05-2008, 04:00 AM

Thank You very much! LadynRed

**CSSKid** · 12-05-2008, 08:19 AM

Heres a Quick Example on how to Center your Page with CSS.I kinda went far and beyond what you probobly wanted but heres the basics of how to create your text to be centered in a div with a wrapper around it.

Keep in mind - text-align:center;
also centers your text on your page.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body {
background:#ECECEC;
}
#container {
width:100%;
height:100%;
}
#box {
height:350px;
width:350px;
background:#333;
margin:auto;
padding:auto;
color:#fff;
text-align:center;
}

</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Title goes here</title>
</head>
<body>
     <div id="container">
       
           <div id="box">
    
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
<p>This is some example Text</p>
               </div>
          </div>



</body>
</html>

**LadynRed** · 12-05-2008, 11:18 AM

Everything is spelled out in detail in the stickies. The text-align:center isn't necessary unless you're worried about supporting the dinosaur IE 5.5 or older.