Pourquoi mon Iframe n'est-elle pas centrée ? (Le correctif de propriété `display`)

Centrage horizontal des Iframes

Si vous rencontrez une iframe qui n'est pas centrée horizontalement malgré l'utilisation de margin: 0 auto;, le problème peut résider dans la propriété d'affichage de l'iframe. Par défaut, les iframes ont un affichage en ligne, ce qui les empêche de s'aligner avec des éléments de niveau bloc comme les divs.

Pour résoudre ce problème et centrer l'iframe horizontalement, ajoutez la règle CSS suivante :

<code class="css">iframe {
    display: block;
}</code>

Cette modification définit la propriété d'affichage de l'iframe sur block, lui permettant de se comporter comme un élément de niveau bloc. Par conséquent, l'iframe s'alignera désormais correctement horizontalement avec le div environnant.

Par conséquent, le code CSS mis à jour suivant centrera à la fois le div et l'iframe horizontalement :

<code class="css">div, iframe {
    width: 100px;
    height: 50px;
    margin: 0 auto;
    background-color: #777;
}

iframe {
    display: block;
    border-style: none;
}</code>

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!