Search code examples
htmlcss

Can you style an active form input's label with just CSS


Given the following html

<label for="inputelement">label</label>
<input type="text" id="inputelement" name="inputelement" />

You can style the input on focus using

input:focus { background: green; }

Is there a way of also styling the <label /> without JavaScript?

Thanks all


Solution

  • No. there is unfortunately no predecessor selector in css

    input:focus -+ label { ... }
    

    would be lovely.

    having the label after the input would be dooable:

    input:focus + label { ... }
    

    you could use some positioning to display before...