July 5, 2013

How to make div horizontally and vertically center align?

Leave a Comment
How to center a div in a page horizontally and vertically

So many people have been asked me about the same query even yesterday a new web designer in my company having six months of experience, asked me that how to align a div center on a page without using any JavaScript and any other script. There are two ways through CSS to make a div horizontally and vertically centers align on a page.

Demo 1

How to make a div center align (vertically & horizontally)

Summary:
In demo 1, we just fixed the height and width of a div and add position, left, top and margin. We gave margin in negative because to make it in proper center aligned.





Demo 2

Horizontally and Vertically Center a DIV with CSS

Summary:
In demo 2, we just fixed the height and width of a div and add position, top, right, bottom, left and margin. This time we used all four direction is equal to zero and gave margin “auto” to make it center align.
Read More...