Supposons avoir:

<div class="home">
<input type="checkbox"/>....
</div>

Je dois insérer margin-left:3px dans la case à cocher. Mon code css est:

.home+input[type=checkbox]{
margin-left:3px;
}

Tout le monde peut m'aider ^

0
Doflamingo19 20 nov. 2018 à 19:43

3 réponses

Meilleure réponse
.home input[type="checkbox"]{
margin-left:3px;
}
<div class="home">
<input type="checkbox"/>....
</div>

Vous n'avez pas vraiment besoin du plus ... sauf si vous avez un besoin spécifique, et vous avez besoin de citations autour de checkbox ..!

2
Dammeul 20 nov. 2018 à 16:47

Les deux autres réponses fonctionnent, mais aucune d'elles n'est exacte.

Bien que j'ai tendance à recommander de mettre des guillemets autour des sélecteurs d'attributs [type="checkbox"], cela fonctionnera parfaitement bien sans guillemets [type=checkbox]. Les citations ne sont nécessaires que si vous incluez des caractères spéciaux.

La raison pour laquelle votre code ne fonctionnait pas était que le + dans votre sélecteur correspond aux frères et sœurs.

.home+input[type=checkbox]{} correspondrait à un élément d'entrée avec le type de case à cocher qui est placé immédiatement après un élément avec une classe de home.

<div class="home">....</div>
<input type="checkbox"/>....

Puisque votre élément d'entrée est imbriqué dans .home, vous n'utiliserez pas le sélecteur frère +

C'est pourquoi ce code fera l'affaire:

.home input[type=checkbox]{
margin-left:3px;
}
<div class="home">
<input type="checkbox"/>....
</div>
2
Alexander Rice 20 nov. 2018 à 17:27

Vous l'avez presque eu, il vous suffit de mettre la case à cocher entre guillemets input[type="checkbox"]

input[type="checkbox"] 
  {
    margin-left:10px;
  }
<div class="home">
<input type="checkbox"/>
</div>
2
Aaron McGuire 20 nov. 2018 à 16:46