Andre Chenier
Andre Chenier

Reputation: 1186

Correct :last-child CSS3 syntax for last li of ul>li>ul>li structure

I need to make 2nd level and very last li hidden by display:none; command. However I couldn't achieve with trials below:

my ul li structure

<ul>
    <li>
        <ul>
            <li>dynamic content</li>
            <li>dynamic content</li>
            <li>* * *</li>
        </ul>
    </li>
    <li>
        <ul>
            <li>dynamic content</li>
            <li>dynamic content</li>
            <li>* * *</li>
        </ul>
    </li>
    <li>
        <ul>
            <li>dynamic content</li>
            <li>dynamic content</li>
            <!-- I need to make li below hidden-->
            <li>* * *</li>
        </ul>
    </li>
</ul>

unsuccessful trials:

made all * * * hidden -> li ul:last-child li:last-child{display:none;}

made all * * * hidden also -> li ul li:last-child{display:none;}

can you please correct me?

Upvotes: 0

Views: 36

Answers (1)

beercodebeer
beercodebeer

Reputation: 990

This appears to do what you want:

ul li:last-child ul li:last-child{display:none;}

Fiddle demo

Upvotes: 1

Related Questions