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.

0 comments:

Post a Comment