Comment centrer une Iframe horizontalement en HTML et CSS ?

Centrer une iframe horizontalement

Considérez le code HTML et CSS suivant :

<div>div</div>
<iframe></iframe>

div, iframe {
    width: 100px;
    height: 50px;
    margin: 0 auto;
    background-color: #777;
}

Le but est de centrer l'iframe horizontalement comme le div.

Cependant, l'iframe reste aligné à gauche. En effet, les iframes sont par défaut des éléments en ligne. Les éléments en ligne ne respectent pas la marge : 0 auto ; horizontalement.

Pour centrer l'iframe, vous devez en faire un élément de bloc. Cela peut être fait en ajoutant display: block; au CSS de l'iframe :

iframe {
    display: block;
    border-style:none;
}

Avec cet ajout, l'iframe deviendra un élément de bloc et répondra à margin: 0 auto;. Cela le centrera horizontalement comme le div.

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!