Centrer verticalement un texte dynamique en CSS

Notre exemple à pour but de centrer un texte de façon vertical sans connaitre le nombre de caractère.

HTML :

XHTML
1
2
3
<div class="parent">
<p class="enfant"></p>
</div>

CSS :

CSS
1
2
3
4
5
6
7
8
9
.parent {
transform-style: preserve-3d;
}
 
.enfant {
position: relative;
top: 50%;
transform: translateY(-50%);
}

 

Laisser un commentaire