CODEWITHSUNDEEP
htmlcss
FiveTools
FiveTools

Reputation: 6030

Will :last-child work on the last list item in an unordered list?

if this is the html:

<ul>
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#">link 3</a></li>
<li><a href="#">link 4</a></li>
</ul>

and this is the css:

ul li
{
  margin-right:5px;
  display:block;
  float:left;
}

Is there a way to use :last-child so there is no margin-right on the last list item?

I tried

ul li:last-child
{
  margin-right:0px;
}

and it didn't work. How would this pseudo-selector be used on a li element?

Upvotes: 1

Views: 922

Answers (3)

Paul D. Waite
Paul D. Waite

Reputation: 98826

:last-child isn’t supported in:

  • IE 8 and below
  • Opera 9 and below
  • Safari 3 and below

http://www.browsersupport.net/CSS/:last-child

Are you using one of those browsers?

Upvotes: 0

j08691
j08691

Reputation: 207900

You have an error in your rule. It says ui but should be ul. And it should work fine.

Here's a jsFiddle example.

Upvotes: 3

Nick
Nick

Reputation: 1272

you misspelled your css

You have

ui li:last-child

and it should be

ul li:last-child

And your question is asking about margin-left, but your css is showing us margin-right

Upvotes: 2

Related Questions