Maison > Article > interface Web > Voici quelques titres basés sur des questions qui correspondent à votre article : * Pourquoi mon Iframe ne se centre-t-il pas horizontalement dans une division ? * Comment centrer une Iframe dans une Div : une solution simple * Centrage d'un Iframe Hori
Comment centrer horizontalement une Iframe dans une Div
Introduction :
Centrer une iframe horizontalement dans un div peut être un défi de mise en page CSS courant. Dans cet article, nous explorerons le problème et proposerons une solution pour parvenir à cet alignement.
Le problème :
Comme illustré dans l'exemple de code, une iframe peut n'apparaît pas centré horizontalement malgré sa largeur définie et sa "marge: 0 auto;". En effet, les iframes sont intrinsèquement des éléments en ligne et ne se comportent donc pas de la même manière que les conteneurs div.
Solution :
Pour centrer l'iframe, nous devons modifier sa propriété d'affichage pour "bloquer". Cela fait que l'iframe se comporte comme un élément de niveau bloc, permettant le "margin: 0 auto;" propriété pour prendre effet et répartir les marges uniformément.
Exemple de code :
Le code CSS modifié ci-dessous centrera 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>
En ajoutant "display: block;" au CSS iframe, l'iframe s'alignera désormais horizontalement au centre de son conteneur div parent.
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!