Webdev Live , Webinar 04 Assignment : Pseudo Classes

#1

While creating a drop down menu, what’s wrong with this?

li li{
display:none;
}

ul:hover > li{
color:blue;
display:block;
}

Correct HTML and CSS file :
https://github.com/coding-blocks-archives/WebNodeLive2017Winter/tree/master/Webinar05/collapsible_list

#2

here, the parent ul displays the “outer” li on hovering.
you want to change display of the inner li, but this css code works on the outer ul as they cover up inner ul space, thus the css display change in never applied to that.