dimanche 30 août 2020

CSS: Changing background color of parent label when the input checkbox is checked? [duplicate]

I have a html form with the following checkboxes:

<label><input type='checkbox' name='tag' value='1' /> Tag #1</label>
<label><input type='checkbox' name='tag' value='2' /> Tag #2</label>
<label><input type='checkbox' name='tag' value='3' /> Tag #4</label>

Those label's are styled like this:

label {
    display: inline-block;
    padding: 5px;
    background: #CCC;
    color: #fff;
    border-radius: 999em;
    -moz-border-radius: 999em;
    -webkit-border-radius: 999em;
    }

I found out how to change the checkbox-style itself using :checked - but I didn't manage to change the styling of the parenting label (I wand to change the label's background color from #CCC to something else, e.g. #FC0), when the checkbox is checked. If anyhow possible using only CSS and no JS. Is that possible?




Aucun commentaire:

Enregistrer un commentaire