1 reply [Last post]
ravipat
ravipat's picture
Offline
newbie
Last seen: 7 years 38 weeks ago
Timezone: GMT-8
Joined: 2014-01-21
Posts: 1
Points: 2

What is meaning of following code:
ul li ul, ul li:hover ul li ul {
}

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 3 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Hi ravipat, Firstly the parts

Hi ravipat,
Firstly the parts separated by the comma and before the { are selectors.
Selectors are used to target elements on the page that you want to style.
The style rules would be between { and }.
In your case the selectors you have are: ul li ul and ul li:hover ul li ul
The first one  ul li ul targets a UL ( unordered list) within LI and another UL. So the second level List container.
The Second ul li:hover ul li ul is targeting another level down only when you are hovering over the parent LI.

You should get the same effect removing the redundant LI in both the selectors as long as they aren't there for specificity.
ul ul, ul li:hover ul ul

You may want to look at Element Selectors and the hover pseudo class