How to centre a page with CSS
Posted: Mon Mar 01, 2010 1:16 am
When designing the layout of a web page, it is common to want to center the entire page. Luckily, this is very easy to do without breaking standards. All you have to do is wrap the entire page with a div with the left and right margins set to auto (margin: 0px auto;).
Here is an example:
Here, margin specifies the top/bottom and the left/right respectively.
That's all there is to it!
Here is an example:
Code: Select all
<html>
<body>
<div class="wrapper">Contents of page...</div>
</body>
</html> Code: Select all
.wrapper {
margin: 0px auto;
width: 600px;
} That's all there is to it!