Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS layout to place a div on center of the screen

Tags:

html

css

Again about css layout:

#container{
width:979px;
height:590px;
margin-left:auto; //works
margin-right:auto; //works
margin-top:auto; //doesn't work
margin-bottom:auto; //doesn't work
}

So, I want #container to place in the center of screen.
I also tried: margin:auto - without result.

like image 267
Alice Avatar asked Feb 02 '26 12:02

Alice


2 Answers

What about something like:

#container{
width:979px;
height:590px;
position:absolute;
left:50%;
top:50%;
margin:-295px 0 0 -490px;
}
like image 179
gabrielhilal Avatar answered Feb 05 '26 02:02

gabrielhilal


Or maybe you can use this solution :

<div class="container">
    <div class="block">
        <p>Hello world, i'm a vertical align div !</p>
    </div>    
</div>

div.bloc { 
    display:inline-block;
    vertical-align:middle;
}
like image 45
Hakadel Avatar answered Feb 05 '26 03:02

Hakadel