Donation?
Yes, it is better than ads and it's optional.
If this site has helped you please consider
remunerating an amount you deem appropriate.
Center a DIV block
One of the first things a new developer wants to know how to do when hand coding their HTML using cascading style sheets is how to center the page. In actuality you are centering a block and the block will be a DIV tag. Here is how:
- Set text-align: center for the <body>. This code will center all page content.
- Place your page text in a <div> that will be the main section for all your page content
- Set the following styles for the main <div>
- width: 760px - set the size as appropriate for your page
- margin-left: auto; - <div> wants to be centered, so let the browser do it automatically
- maring-right: auto; - <div> wants to be centered, so let the browser do it automatically
- text-align: left; - now set the text to be left aligned within the main <div> block
<body style='text-align: center'>
<div style='width: 760px; margin: auto; text-align: left'>
This is aligned left in a centered box.
</div>
</body>
And that is how to center a web page.
Did you find this article userful for your website?
If so, why not provide a link to it? Just copy the following to your web page:
If so, why not provide a link to it? Just copy the following to your web page:
<a href='http://upwithabang.com/articles/css-centering.html'>
Centering using CSS
</a>
Share this:
