Can someone help me with the following HTML and CSS issue?
<form class="Form">
<FormField>
<label class="FormLabel" ..>
<div class="FormInput">
<div class="InputField">
<input../>
</div>
</div>
</FormField>
</form>
I am trying to style the FormLabel when the input is focused. However, I cannot use a parent selector in CSS to achieve this.
Is there any way to access the parent element using only CSS (without jQuery)?
I attempted to use the & operator in LESS like this:
.Form {
.FormField {
.Input:focus & .FormLabel {
border:green
}
}
}
But unfortunately, it did not work as expected. What am I doing wrong here? Thank you for your help!