Alignement des DIV horizontalement

Lorsque vous essayez de centrer les DIV horizontalement dans un conteneur DIV, vous pouvez rencontrer des problèmes d'alignement. Cela peut se produire pour plusieurs raisons. Pour résoudre le problème, envisagez la solution suivante :

Utilisez l'affichage en bloc en ligne au lieu de Float

Au lieu d'utiliser la propriété float, envisagez d'utiliser l'affichage : inline- attribut de bloc. Cela garantira que les DIV sont affichés sous forme d'éléments en ligne, permettant un alignement horizontal.

Code mis à jour

Pour implémenter cette solution, modifiez votre code CSS comme suit :

.row {
  width: 100%;
  margin: 0 auto;
}
.block {
  width: 100px;
  display: inline-block;
}

Cet ajustement corrigera le problème d'alignement horizontal, permettant aux DIV d'être positionnés au centre du conteneur. Il convient de noter que cette approche est particulièrement adaptée aux scénarios dans lesquels la largeur des DIV est fixe ou relativement similaire.