Comment centrer horizontalement une division avec une largeur minimale à l'aide de CSS ?

Centrage horizontal d'un <div> avec une largeur minimale à l'aide de CSS

Encapsuler un <div> élément dans un autre élément <div> permet un centrage horizontal précis. L'extérieur <div> détermine les contraintes de largeur, tandis que le <div> contient le contenu souhaité.

Pour un <div> de largeur variable, le CSS suivant peut réaliser un centrage horizontal tout en conservant une largeur minimale :

#wrapper {
  background-color: green; /* for visualization purposes */
  text-align: center;
}
#yourdiv {
  background-color: red; /* for visualization purposes */
  display: inline-block;
}

<div>

Le <div> avec le id="wrapper" établit une couleur d'arrière-plan pour la visualisation et centre le texte à l'intérieur en utilisant text-align: center. L'intérieur <div> avec id="yourdiv" se voit attribuer une couleur d'arrière-plan pour plus de clarté. Il utilise display: inline-block pour effectuer le rendu en tant qu'élément en ligne tout en conservant la possibilité d'ajuster sa largeur.

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!