CODEWITHSUNDEEP
csshtmlpositionalignment
Registered User
Registered User

Reputation: 9006

Centering a div to the middle of the web page?

I want to make my div be positioned in the middle-center part of the web page. I'm attempting to make a pre-loader div which should be in the middle-center part of the web page and after the page loads, that div will be hidden. How can I achieve such?

The div should be centered horizontally and vertically.

Upvotes: 4

Views: 23634

Answers (2)

stecb
stecb

Reputation: 14746

to center a div both hor and ver you could do this way:

markup

<div class="centered"></div>

css

.centered{
    position:absolute;
    width:100px;
    height:100px;
    left:50%;
    top:50%;
    margin-left:-50px;
    margin-top:-50px;
}

fiddle: http://jsfiddle.net/steweb/qSvAQ/1/

Upvotes: 7

Spyros
Spyros

Reputation: 48626

<div class = 'middle'></div>

.middle{
  margin: auto;
  width: 900px;
}

Upvotes: 8

Related Questions