Amran Amran - 4 months ago 29
HTML Question

Select CSS Element Outside of Parent Element

I want to select CSS element that are outside of the parent selector. Can I do that with just CSS? Below are the example that I want to achieve:

<p>Register Form</p>
<p>Full Name :</p>
<p><input type='text' name='name' required></p>
<p>Please fill in the box above</p>

I want make the
after the
to be hidden if the input type is not empty. Below are the
that I have tried but with failed result:

div > p input:required:valid + p {
display: none;


Sadly this can't be done with pure css. You can't modify parents of elements with css, only children and subsequent siblings.

You could have javascript toggle a class on the parent div when its child input is valid/invalid, and then use CSS to modify the parent div's sibling.