How to center body on a page?

Posted 2020-09-30 人最大的荣耀不在于从未失败，而在于每次失败以后都能东山再起

 

【提问】

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;

}

 

【回答】

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.