CODEWITHSUNDEEP
htmlcss
LouisK
LouisK

Reputation: 1176

Trouble making css :last-child work for me

Obviously I must be doing something wrong, but I can't figure out what's wrong with this, it's driving me crazy.

The selector I'd LIKE to use is: .menu ul li:last-child > a

The 'unique selector' that firefox gives me is .menu > ul:nth-child(1) > li:nth-child(5) > a:nth-child(1)

the HTML is: 

<div class='menu'>
    <ul><li><a href=''>Home</a></li>
        <li><a href='1'>Link 1</a></li>
        <li><a href='2'>Link 2</a></li>
        <li><a href='3'>Link 3</a></li>
        <li><a href='4'>Link 4</a></li>
    <ul>
 </div>

How is li:last-child > a not selecting 'Link 4'? I am really quite confused, so thanks in advance for the upcoming lesson.

Upvotes: 0

Views: 32

Answers (1)

Sebsemillia
Sebsemillia

Reputation: 9476

Simple, your closing ul tag is wrong.

<div class='menu'>
    <ul><li><a href=''>Home</a></li>
        <li><a href='1'>Link 1</a></li>
        <li><a href='2'>Link 2</a></li>
        <li><a href='3'>Link 3</a></li>
        <li><a href='4'>Link 4</a></li>
    </ul> //change this
 </div>

Working Fiddle

Upvotes: 3

Related Questions