How to center the content of a web page

3.4 (5 votes)

This question gets asked very often in the forums and newsgroups, and is very easy once you know how.

Create a "wrapper" div to hold all your content and apply its width property through CSS, then give it a margin:auto attribute

 
<style type="text/css">
  #wrapper {width: 760px;margin:auto}
  #content{background-color:red}
  </style>
  </head>
  <body>
  <form id="form1" runat="server">
    <div id="wrapper">
      <div id="content">
        content
      </div>
    </div>
  </form>
  </body>

Date Posted:
Last Updated:
Posted by:
Total Views to date: 27929

4 Comments

- Mikey

I don't know if this was intended, but in your snippet above. I think you have an extra <div id="wrapper">

- Mike

@Mikey,

Thanks for spotting that. I have corrected it.

- tom

i have a web page that uses html5 and i have tried everything to center my page with no success. everything i try the page stays in the left corner of my screen. any suggestions i would appreciate it. thanks.

- Mike

@tom

The technique outlined above works with the HTML5 doctype.

Recent Comments

Jon 31/03/2016 21:36
In response to Exploring Prefix: A Free ASP.NET Profiling Tool
We had the exact same experience, finding multiple bugs in an application that we thought was pretty...

ranjith 31/03/2016 05:50
In response to A Better Way To Export Gridviews To Excel
Hello Mike. i am exporting from gridview, because i have some images in my gridview. but i am error...

Matt Watson 30/03/2016 22:19
In response to Exploring Prefix: A Free ASP.NET Profiling Tool
Glad you are loving it! Matt from Stackify...

Dmitry 28/03/2016 04:26
In response to Solved - The Microsoft.ACE.OLEDB.12.0 provider is not registered on the local machine
thank you about the VS 32-bit remark...

federico 26/03/2016 11:29
In response to Request.Form Is Empty When Posting To ASPX Page
thanks!....

Micheal 23/03/2016 00:58
In response to ASP.NET MVC 5 with EF 6 - Working With Files
Thanks for the code. its pretty straightforward. worked for me on my first trial. Perfect!...

Francisco 22/03/2016 20:35
In response to ASP.NET MVC 5 with EF 6 - Working With Files
The post is very good, thanks...

Nick Brown 22/03/2016 13:53
In response to Adding A View
Hi, Many thanks for this tutorial, it's helping me get started with MVC. In VB (VS 2013) I get late...

ferry mae 22/03/2016 13:04
In response to Send form content by email in ASP.NET
do i need to change this? message.To.Add(new MailAddress("me@domain.com")); message.CC.Add(new you...

Keith 22/03/2016 12:02
In response to Creating a Connection String and Working with SQL Server LocalDB
As always worst explanation, but this time you rocked with plagiarism too .. huhh.. copied from Rick...