PDA

View Full Version : How to center a Div vertically


Chapo
03-06-2011, 02:20 AM
Ok... i know to center a Div or Wrap Horizontally, but i can't figure out how to do it vertically. Any ideas ?

johnMoss
03-06-2011, 04:59 AM
Try something like this:


#mydiv{
position:absolute;
top: 50%;
left: 50%;
width:30em;
height:18em;
margin-top: -9em; /*set to a negative number 1/2 of your height*/
margin-left: -15em; /*set to a negative number 1/2 of your width*/
}

Chapo
03-06-2011, 04:42 PM
Thats was nice... thanx

johnMoss
03-06-2011, 05:03 PM
You of course set your height & width to whatever, the key to making it work is as you see in the notes, set the margins to negative half of the H & W...

Chapo
03-06-2011, 07:04 PM
So if my div is 900 in height and 500 in width it will be -450 and -250 ?

johnMoss
03-06-2011, 07:06 PM
That's correct.