Div centrée

en hauteur et largeur

by toubia95

HTML

<div class="premier">
        div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond div de fond 
    </div>
<div class="container">
    <div class="centered">
        <p>div centré</p>
    </div>
</div>

CSS

/* http://www.alsacreations.com/xmedia/tuto/exemples/vertical/demos.html#cv_blocs */

body {
   background:white;
}
.container {
    background:rgba(0,0,0,0.5);
    position:fixed;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}
.centered {
    background:rgba(255,255,255,0.8);
    display: table-cell;
    position: absolute;
    top: 33%;
    bottom: 33%;
    left: 33%;
    right: 33%;
    vertical-align: middle;
}