Quero que o meu texto fique centralizado horizontalmente e verticalmente no elemento <div>
. Para isso, estou utilizando as propriedades text-align
e vertical-align
para este elemento.
O problema é que a propriedade vertical-align: middle;
não está centralizando o texto verticalmente. Abaixo está o meu código:
#myDiv {
border: 2px solid #0f0;
height: 100px;
text-align: center;
vertical-align: middle;
width: 300px;
}
<div id="myDiv">Este daqui é o meu texto</div>
vertical-align: middle;
funciona apenas quando o display for table-cell (ou inline, em alguns casos).