posée par

Comment faire pour centrer un élément en HTML ? Par exemple comment faire pour centrer horizontalement un DIV dans un autre DIV ?

<div class="exterieur">  
     <div class="interieur">Élément à centrer horizontalement</div>
</div>

1 Réponse

+1 vote
répondu par

Vous pouvez centrer horizontalement une balise DIV avec la propriété MARGIN, de cette manière :

.interieur {margin: 0 auto;} 

Pour une meilleure compatibilité avec Internet Explorer 8+, il est préférable d'ajouter la propriété DISPLAY, comme ceci :

.interieur {display: table ; margin: 0 auto;} 

Cela rend l'élément interne centré horizontalement et il fonctionne sans définir une width spécifique.

Voici le code complet basé sur votre exemple pour centrer horizontalement un DIV dans un autre DIV :

<style>
.interieur {display: table; margin: 0 auto;} 
</style>

<div class="exterieur" style="width:100%">
    <div class="interieur">Élément à centrer horizontalement</div>
</div>

Pour centrer horizontalement le contenu d'une balise DIV, vous devez utiliser TEXT-ALIGN de cette manière :

<style>
.centrer-texte {text-align: center;}
</style>

<div class="centrer-texte">Ce texte est centré</div>

Contenu pertinent

Questions liées

1 réponse
posée par anonyme 23-Septembre-2018
1 réponse
posée par anonyme 24-Septembre-2018
1 réponse
posée par anonyme 06-Octobre-2018

Merci pour votre visite sur 1FORMATIK.com

Un petit clic sur la pub est toujours apprécié, c'est elle qui finance le site

Bon surf

...