W3C home > Mailing lists > Public > public-css-archive@w3.org > November 2019

[csswg-drafts] Disabled labels `label:disabled` (#4524)

From: Martijn Cuppens via GitHub <sysbot+gh@w3.org>
Date: Thu, 21 Nov 2019 09:54:58 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-526482949-1574330097-sysbot+gh@w3.org>
MartijnCuppens has just created a new issue for https://github.com/w3c/csswg-drafts:

== Disabled labels `label:disabled` ==
Is there any possibility labels which refer to a disabled input (or any form control like `select`, `textarea`, ect...) can have additional styling applied to?

For example:
HTML:
```html
<!-- Normal label: -->
<div>
  <label for="test">Label</label>
  <input type="checkbox" id="test">
</div>

<!-- This disabled label can be styled with a sibling selector: -->
<div>
  <input type="checkbox" id="test2" disabled>
  <label for="test2">Label</label>
</div>

<!-- This disabled label can not be styled in CSS: -->
<div>
  <label for="test3">Label</label>
  <input type="checkbox" id="test3" disabled>
</div>

<!-- This disabled label can not be styled in CSS: -->
<label>
  <span>Label</label>
  <input type="checkbox" disabled>
</label>
```

CSS:
```
input:disabled {
  /* Styling for disabled input, this currently works */
}

label:disabled {
  /* Styling for label referring to a disabled input, this currently doesn't works */
}
```

So my proposal is to add a disabled state for labels, like described in the CSS block above. Let me know if I'm missing something here.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4524 using your GitHub account
Received on Thursday, 21 November 2019 09:54:59 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:56 UTC