CODEWITHSUNDEEP
htmlcsssass
Alexander Solonik
Alexander Solonik

Reputation: 10240

How to make the li a direct selection of the ul , while maintaining the SCSS syntax?

I have just started using scss recently , Now i often write code like this:

.site-internal-navigation {
    &:after,
    &:before {
        display: none;
    }
    display: flex;
    align-items:center;
    justify-content:space-between;


    .site-nav-links-list {
        li {
            display: inline-block;
        }
    }
}

Overall i really like scss, not much differrent from css. Now what do i do whant to code a menu that has multiple nested li's and ul's

For example in the below code:

ul.site-nav-links-list {
    li {
        display: inline-block;
    }
}

I would actually like to make the li selection a direct child of the ul , but at the same time maintaining the above syntax, how do i do this ??

Upvotes: 1

Views: 176

Answers (1)

Hodrobond
Hodrobond

Reputation: 1696

Try adding an >, it refers to the "direct child"

ul.site-nav-links-list {
    >li {
        display: inline-block;
    }
}

Upvotes: 2

Related Questions