码农教程 - 一技在手,衣食无忧! tools

目录

How TO - Center Website

❮ Previous Next ❯

Learn how to center your website horizontally with CSS.

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 »

Ever heard about 91xjr Spaces? Here you can create your website from scratch or use a template, and host it for free.

Get started for free ❯

* no credit card required


❮ Previous Next ❯