Maison > interface Web > tutoriel CSS > Comment centrer horizontalement un élément Div en CSS ?

Comment centrer horizontalement un élément Div en CSS ?

Barbara Streisand
Libérer: 2024-12-23 10:24:28
original
939 Les gens l'ont consulté

How Do I Horizontally Center a Div Element in CSS?

Maîtriser le centrage horizontal pour

Éléments avec CSS

Imaginez une page ornée d'un

élément qui flotte sereinement en son centre, mettant en valeur son contenu en parfait alignement avec le texte environnant. Comment y parvenir sans effort avec CSS ? Dévoilons l'approche la plus simple pour les fichiers
à largeur fixe et variable. éléments.

Largeur fixe

Pour un élément

orné d'une largeur prédéterminée, se concentrer sur son centre est un jeu d'enfant avec les directives CSS suivantes :

#yourdiv {
  margin: 0 auto;
  width: 400px; /* Set the desired width */
}
Copier après la connexion

Largeur variable

Face à un

dont la largeur peut fluctuer, une tactique astucieuse apparaît :

#wrapper {
  text-align: center;
}

#yourdiv {
  display: inline-block;
}
Copier après la connexion

Cette disposition garantit que le L'élément centre son contenu, y compris le toujours aussi mystérieux . Ainsi, quelle que soit la longueur du contenu, l'attribut

trouve toute sa place au cœur de votre page web.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal