28172 sujets

CSS et mise en forme, CSS3

Bonjour,
Mon problème est très simple, mais je n'y arrive pas Smiley decu
Je ne comprends pas comment cibler ma section #right à partir d'un état de ma checkbox

voici le code de test : lien

Le but est de changer la couleur de ma section lorsque la checkbox est cochée le tout en CSS pure (sans JS ni jQuery)

si je vire les lignes 1 et 4, j'y arrive sans probleme avec le css :
input:checked#couleur ~ main > #right {
background:green;
} mais je souhaite laisser le div qui encapsule la checkbox


Merci de votre aide
Modifié par zero974 (30 Jul 2020 - 14:16)
Modérateur
Salut,

Malheureusement en CSS on ne peut pas "remonter un niveau" dans la généalogie... On peut descendre ou sélectionner les frères. C'est pourquoi sans la div tu y arrive et avec tu n'y arrive pas. En pur CSS c'est encore impossible.

On attend tous impatiemment un sélecteur du genre :has() ou <

En attendant... pas de div ou Js Smiley smile

CSS-Tricks a écrit :
Let’s be clear here, just in case someone is finding this from a search engine: there are no parent selectors in CSS, not even in CSS3.

https://css-tricks.com/parent-selectors-in-css/
Modifié par _laurent (30 Jul 2020 - 15:02)
Meilleure solution
j'en étais sur Smiley smile
oui vivement que ce sélecteur sorte.... je le suis depuis longtemps !
j'ai trouvé une astuce, je mets l'input caché au niveau du main et le label dans la div

Merci bcp
Modifié par zero974 (30 Jul 2020 - 15:14)