hover on parent element with css -

i wondering if there way can apply hover effect on parent element css. example, have navigation:

<nav> <ul>     <a href="#"><li id="firstlielement" class="main-nav ieraksti">ieraksti!</li></a>         <ul id="audio_sub_menu">             <li class="mes">mēs 1</li>             <li id="klienti">mēs 2</li>         </ul>     <a href="#"><li class="main-nav" id="audio">paklausies!</li></a>     <a href="#"><li class="main-nav" id="video">paskaties!</li></a>     <a href="#"><li class="main-nav" id="kontakti">pasūti!</li></a> </ul> </nav>` 

and want to, when hovered on nav ul ul li element, affects #firstlielement . know can done js, there has way css. found lot of solutions when need affect sibling or child, didn't find situation.

edit:

sorry, didn't write looking for... yes, sub_menus hidden, when hover main navigation li element, shove up, , stay visible when hover on them. missing change background color of main navigation li element when sub menu hovered.

i found you.

a < img { border: none; } 

in example, select tags if contained img tag. (aside: weird departure typical syntax actual elements being selected on right, on left).

a img:parent { background: none; } 

the key difference being :parent syntax evaluate single element, parentnode available in dom every element. similar forcing :has selector evaluate children rather descendants.

https://css-tricks.com/parent-selectors-in-css/