Pourquoi les divisions flottantes s'empilent-elles verticalement même avec Overflow : caché ?

Alignement horizontal des divs flottants

Dans les cas où les divs flottent à gauche dans un conteneur avec débordement : masqué, ils peuvent s'empiler verticalement même lorsqu'ils il y a suffisamment d'espace horizontalement. Pour vous assurer qu'ils s'alignent correctement, envisagez la solution suivante :

Solution :

Créez un div interne dans le conteneur qui a une largeur plus large, suffisante pour accueillir tous les éléments flottants. divs.

#container {
  width: 200px;
  overflow: hidden;
}

#inner {
  width: 2000px;
  overflow: hidden;
}

.child {
  float: left;
  width: 50px;
  height: 50px;
}

<div>

En fournissant une largeur suffisante dans le div intérieur, les divs flottants s'aligneront horizontalement dans le conteneur, comme prévu.

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!