Comment puis-je centrer verticalement du texte et des images dans Bootstrap 3 ?

Centrage vertical du texte et des images dans Twitter Bootstrap 3 (duplicata)

De nombreuses demandes ont été faites concernant l'alignement vertical du texte et des images dans Twitter Bootstrap 3. Ce sujet mérite une discussion plus approfondie.

Lors de l'utilisation de Bootstrap 3 avec du contenu dynamique, déterminer la taille précise du visuel les éléments peuvent être difficiles. De plus, la mise en page doit conserver sa réactivité.

Pour centrer verticalement le texte et les images, envisagez d'utiliser une approche alternative. Au lieu de faire flotter les éléments, définissez leur affichage sur inline-block. De plus, utilisez vertical-align:middle pour garantir un alignement vertical correct.

Vous trouverez ci-dessous un exemple d'extrait CSS qui illustre cette technique :

.col-lg-4, .col-lg-8 {
    float: none;
    display: inline-block;
    vertical-align: middle;
    margin-right: -4px;
}

En mettant en œuvre ces ajustements, vous pouvez centrer sans effort votre texte et images verticalement de manière réactive, même avec des dimensions de contenu inconnues.

Pour une démonstration en direct, reportez-vous au Bootply suivant lien :

http://bootply.com/94402

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!