5077 sujets

Sémantique web et HTML

Bonjour,
HTML :
<div class="container">
  <div class="item1">ITEM1</div>
  <div class="item2">ITEM2</div>
</div>
CSS :
.container{
  width: 1000px;
  height: 200px;
  background-color: blue;
}
.item1 {
  position: relative;
  float: left;
  height: 70%;
  width: 200px;
  background-color: white;
}
.item2 {
  position: relative;
  float: left;
  height: 80%;
  left:10px;
  background-color: violet;
}

Quelqu'un peut-il me dire quels attributs mettre dans la classe "item2" pour que le div correspondant occupe toute la largeur restante du div "container"
Merci de votre aide.
YC
Administrateur
Hello,

Il y a plusieurs moyens d'y parvenir avec le positionnement float (que tu as choisi).

Les solutions les plus classiques sont d'appliquer sur .item2 l'une de ces déclaration :
1- width: calc(100% - 210px);
2- overflow: hidden;
3- pas de float ni de position relative sur .item2 mais margin-left: 210px

Tu as un récapitulatif ici : https://codepen.io/raphaelgoetter/pen/QjOjjR

Bonne chance Smiley smile
Meilleure solution