PDA

View Full Version : How to center a Div vertically


Chapo
03-06-2011, 03: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, 05: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, 05:42 PM
Thats was nice... thanx

johnMoss
03-06-2011, 06: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, 08:04 PM
So if my div is 900 in height and 500 in width it will be -450 and -250 ?

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