Yes,it is possible if element is a sibling
or a child
to the :focus
element. If it is not your case (affect whatever you want) than you should use javascript.
Possible to style other element on :focus?
-
05-07-2023 - |
سؤال
Is it possible to style another element on :focus of a specific element?
Something like:
input:focus #header {
display: none;
}
I tried doing that but it didn't work.
المحلول
نصائح أخرى
.input:focus #header
That is applying selecting all #header
where they are a descendant of input
If its a sibling so you want, use the next sibling selector +
:
input:focus + #header
you can also use 'preceded by' selector -> https://www.w3schools.com/cssref/css_selectors.asp
HTML:
<button>button</button>
<div class="div1">div1</div>
CSS:
button:hover ~ .div1 {
color: red;
}
So you hover over the button BUT the div1 element gets styled.
Just make sure that the BUTTON element is first and the element you are styling is SECOND.
لا تنتمي إلى StackOverflow