I would like to know if it is possible to vertical-align in a div with position absolute? Here is the code for analysis:
.teste {
background: #F00;
width: 500px;
height: 100px;
display: table-cell;
vertical-align: middle;
position:absolute;
}
Link to code: link
Thanks!
For this you need to put text between <p></p> :
<div class="teste">
<p>Hue BR<br/>Hue BR<br/>HUe BR</p>
</div>
The way you did it would only work if it were in a table:
<table>
<tr>
<td aling="middle" height="100" style="background:red">Hue BR<br/>Hue<br/>HUe BR</td>
</tr>
</table>
It is possible, yes, it only gets a bit more extensive. You must create another DIV within the one that will have absolute position:
<div class="teste">
<div class="testeInterna">
Hue BR<br>Hue BR<br>HUe BR
</div>
<div>
... and pass all properties to it (except position: absolute)
.teste {
position:absolute;
}
.testeInterna{
background: #F00;
width: 400px;
height: 200px;
vertical-align: middle;
display:table-cell;
}