The Complete Guide to Centering a DIV

Every new developer inevitably finds that centering a div isn’t as obvious as you’d expect. Centering what’s inside a div is easy enough by giving the text-align property a value of center, but then things tend to get a bit sticky. When you get to centering a div vertically, you can end up in a world of CSS hurt.

The aim of this article is to show how, with a few CSS tricks, any div can be centered; horizontally, vertically or both. And within the page or a div.