Comment les marges peuvent-elles être utilisées pour qu'un div remplisse l'espace restant entre d'autres divs ?

Utiliser des marges pour remplir l'espace restant

Dans votre code HTML, vous avez défini les largeurs de div1 et div3, mais pas de div2. Cela laisse une quantité inconnue d'espace entre les colonnes de gauche et de droite, là où div2 devrait se trouver.

Pour que div2 remplisse la largeur restante, vous pouvez utiliser des marges. Voici comment :

#Main {
  width: 500px;
}

#div1 {
  width: 100px;
  float: left;
}

#div2 {
  margin-left: 100px;
  margin-right: 100px;
}

#div3 {
  width: 100px;
  float: right;
}

Dans ce CSS :

• La largeur de div2 n'est pas définie explicitement. Au lieu de cela, ses marges gauche et droite sont définies sur 100 px chacune. Cela force div2 à occuper l'espace entre div1 et div3.
• Notez que div2 est placé après div3 dans le HTML. Cela garantit que div2 est positionné entre les marges de div1 et div3, plutôt que d'être poussé jusqu'à la fin du conteneur.

Avec ces modifications CSS, div2 remplira automatiquement la largeur restante dans le #Main conteneur, en veillant à ce qu'il n'y ait pas d'espace vide entre les trois colonnes.

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!