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><p>En fournissant une largeur suffisante dans le div intérieur, les divs flottants s'aligneront horizontalement dans le conteneur, comme prévu.</p></div>

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!