Skip to main content
Criado snippet com código postado no JSFiddle e removido réplica simplificada (acabando sendo desnecessária)
Fonte Link
LipESprY
  • 4,6mil
  • 2
  • 21
  • 36

Usando CSS3:

.central-hv{
position: absolute;
z-index: 99999999;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
}

Example > http://jsfiddle.net/korzzus/wega9fun/

.conteudo-centro{
position: absolute;
z-index: 99999999;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
}
<section class="conteudo-centro">
    <h1>Opa, estamos no centro da tela!<br>
        Independente da resolução do dispositivo do usuário!  ;) </h1>
</section>

Réplica no JSFiddle;

Usando CSS3:

.central-hv{
position: absolute;
z-index: 99999999;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
}

Example > http://jsfiddle.net/korzzus/wega9fun/

Usando CSS3:

.conteudo-centro{
position: absolute;
z-index: 99999999;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
}
<section class="conteudo-centro">
    <h1>Opa, estamos no centro da tela!<br>
        Independente da resolução do dispositivo do usuário!  ;) </h1>
</section>

Réplica no JSFiddle;

adicionou 24 caracteres ao conteúdo
Fonte Link
Rafael Withoeft
  • 2,3mil
  • 15
  • 31

Usando CSS3:

.central-hv{ position: absolute; z-index: 99999999; left: 50%; top: 50%; transform: translate(-50%, -50%); }

.central-hv{
position: absolute;
z-index: 99999999;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
}

Example > http://jsfiddle.net/korzzus/wega9fun/

Usando CSS3:

.central-hv{ position: absolute; z-index: 99999999; left: 50%; top: 50%; transform: translate(-50%, -50%); }

Example > http://jsfiddle.net/korzzus/wega9fun/

Usando CSS3:

.central-hv{
position: absolute;
z-index: 99999999;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
}

Example > http://jsfiddle.net/korzzus/wega9fun/

Fonte Link

Usando CSS3:

.central-hv{ position: absolute; z-index: 99999999; left: 50%; top: 50%; transform: translate(-50%, -50%); }

Example > http://jsfiddle.net/korzzus/wega9fun/