How to center body on a page

Question

I m trying to center the body element on my HTML page     Basically  in the CSS I set the body element to be display  inline-block  so that it is only as wide as its contents  That works fine  However  margin  0px auto  doesn t center it on the page   Does anyone know how to fix this  I want the big blue square to be centered on the page  not floating to the left like it is now   Here s my CSS   body       display  inline-block      margin  0px auto      text-align  center

User · Accepted Answer

Also apply text-align  center  on the html element like so   html     text-align  center      A better approach though is to have an inner container div  which will be centralized  and not the body

User · Answer

You have to specify the width to the body for it to center on the page   Or put all the content in the div and center it    lt body gt       lt div gt      jhfgdfjh      lt  div gt   lt  body gt    div       margin  0px auto      width 400px

User · Answer

For those that do know the width  you could do something like  div        max-width     px    px        margin-left auto       margin-right auto      I also agree about not setting text-align center on the body because it can mess up the rest of your code and you might have to individually set text-align left on a lot of things either then or in the future

User · Answer

body               width 80           margin-left auto          margin-right auto          This will work on most browsers  including IE

[html] How to center body on a page?

Examples related to html

Examples related to css

Examples related to center

Examples related to centering