How TO - Center Website
Learn how to center your website horizontally.
Center Website
Learn how to center your website horizontally:
This example is horizontally centered on screens that are wider than 500 pixels.
How To Center Your Website
Use a container element and set a specific max-width
. A common width many websites use is 960px. To actually center the page, add margin: auto
.
The following example will center the website on screens that are wider than 500px. On screens that are less than 500px wide, it will span the whole of the page:
Example
<style>
.content {
max-width: 500px;
margin: auto;
}
</style>
<body>
<div class="content">
<!-- Page content -->
</div>
</body>
Try it Yourself »