Sempre perco tempo procurando resolver o problema de alinhamento de conteúdo na vertical e que seja cross browser de conteúdo dentro de DIV.
Depois de testar vários métodos, o modo mais simples de alinhar conteúdo na vertical foi criando dois DIVs, um DIV externo usando a propriedade display:table e um segundo DIV usando o display:table-cell com a propriedade vertical-align:middle.
Espero que seja útil para mais pessoas!
<style>
.ContainerExt {
display: table;
width: 330px;
height: 180px;
background-color: #333333;
overflow: hidden;
}
.ContainerExt:hover {
background-color: #000000;
}
.ContainerExt .ContainerInt {
display: table-cell;
margin: 0 auto;
text-align: center;
vertical-align: middle;
width: 100%;
}
</style>
<div class="ContainerExt">
<div class="ContainerInt">
<div class="boxQualquer">
Conteúdo Centralizado
<br />Multi-linha.
</div>
</div>
</div>
Fonte: Andy Howard