HTML and CSS

Really basic Noob question- centering page

Please support our HTML and CSS advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Oct 2008

Posts: 6

Reputation: jevvv is an unknown quantity at this point

Solved Threads: 0

jevvv

Offline

Newbie Poster

Really basic Noob question- centering page

Jul 10th, 2009

I'm doing our site and the template I used looks nice on my old monitor, because it fits the screen. My new computer has a widescreen monitor and so now I see that the layout of the page has the page based on the left side of the monitor

How do I set it so the page centres in the monitor, whatever size is used? Isn't there a simple line that goes into the css to do this?

You can see it here: Mission Adventure

•

Join Date: Jul 2009

Posts: 20

Reputation: zeusofolus is an unknown quantity at this point

Solved Threads: 0

zeusofolus zeusofolus is offline

Offline

Newbie Poster

Re: Really basic Noob question- centering page

Jul 10th, 2009

Setting the right and left page margins to auto will typically solve this problem. (this creates a even left and right margin with the remaining empty space left over on a larger monitor)

For example if your html is:

 Help with Code Tags 
 html Syntax (Toggle Plain Text) 
<html>
<body>
<div id="container">
<p>This is your page content</p>
</div>
</body>
</html>
<html>
<body>
<div id="container">
<p>This is your page content</p>
</div>
</body>
</html>

Then your css doc should be

 Help with Code Tags 
 css Syntax (Toggle Plain Text) 
body {
    margins: auto;
}
 
#container {
    width:760px;
    margins: auto;
}
body {
    margins: auto;
}

#container {
    width:760px;
    margins: auto;
}

Hope this helps
Eric

Last edited by peter_budo; Jul 10th, 2009 at 5:39 am. Reason: Keep It Organized - For easy readability, always wrap programming code within posts in [code] (code blocks) and [icode] (inline code) tags.