Ilja
Ilja

Reputation: 46509

How to center div in the page? (Height & Width)?

silly question, but I can't find answer on it as all answers assume centering div in terms of width.

What I need is to center div in means of height and width so in a very very center of the page.

I tried this, but it just centers div in means of page width no height.

#myDiv {
   width: 500px;
   height: 500px;
   margin: auto;
}

So how can I get it in the VERY center of the page? )))

Upvotes: 1

Views: 15950

Answers (2)

Rob W
Rob W

Reputation: 349132

Create a wrapper with ID wrapper around the #myDiv element, and apply this CSS code:

#wrapper{
    display: table;
}
#myDiv{
    display: table-cell;
    vertical-align: middle; /*Vertically centered*/
    text-align: center; /* Horizontally centered */
}

This code centers elements of any width/height.

Upvotes: 3

HAWKES08
HAWKES08

Reputation: 521

position: absolute;
left: 50%;
top: 50%;
margin-left: -250px; /*(half of width)*/
margin-top: -250px;  /*(half of height)*/

that should work.

Upvotes: 3

Related Questions