Centrer verticalement et horizontalement en CSS dans un conteneur de type block

L'objectif de cette démonstration est de vous montrer qu'il est désormais possible de centrer un élément dans un conteneur de type block de manière moderne. Cela n'était pas possible auparavant en ce qui concerne l'alignement vertical, à moins de déclarer un modèle de contenu flex ou grid. Le support navigateur encore limité pour le centrage horizontal.

Centrer verticalement Centrer horizontalement Centrer horizontalement et verticalement

<div>
<span>Je suis centré verticalement et/ou horizontalement</span>
</div>

.demo {
  
align-content: center; /*nous avons besoin uniquement de cette propriété pour centrer verticalement*/
justify-items: center; /*centre horizontalement tous les éléments enfants */
height: 300px;

}

.demo span {

justify-self: center;/*pour centrer horizontalement un élément enfant en particulier*/

}