How to get the last Element of CSS?

Question

.year-seperator:last-of-type {
    display: none;
}

<ul class="blog-year">  
    <li><a href="http://my.link">2016</a><span class="year-seperator">|</span></li>
    <li><a href="http://my.link">2015</a><span class="year-seperator">|</span></li>
    <li><a href="http://my.link">2014</a><span class="year-seperator">|</span></li>
    <li><a href="http://my.link">2013</a><span class="year-seperator">|</span></li>
</ul>

Then all the separator disappear. Why? How can I get the last element of that class? Or how can I hide it?

Possible duplicate of [Using the last-child selector](http://stackoverflow.com/questions/1293369/using-the-last-child-selector) — Vivekraj K R, Sep 29 '16 at 04:37

Ganesh Putta · Answer 1 · 2016-09-29T04:54:53.587

try this

.blog-year li:last-child .year-seperator {
    display: none;
}

<ul class="blog-year">  
    <li><a href="http://my.link">2016</a><span class="year-seperator">|</span></li>
    <li><a href="http://my.link">2015</a><span class="year-seperator">|</span></li>
    <li><a href="http://my.link">2014</a><span class="year-seperator">|</span></li>
    <li><a href="http://my.link">2013</a><span class="year-seperator">|</span></li>
</ul>

score 2 · Accepted Answer · answered Sep 29 '16 at 04:29

2

Because they are all at last of li. It's the last li element not last span element. It should look like this:

li:last-child .year-seperator {
    display: none;
}

answered Sep 29 '16 at 04:29

Quy Truong

413
3
9

Sumit patel · Answer 3 · 2016-09-29T04:40:29.240

Syntax

element:last-child { style_properties }

Read More Details Click

  .blog-year li .year-seperator:last-child
      {
         display:none; 
      }

    <ul class="blog-year"> 
        <li><a href="http://my.link">2016</a><span class="year-seperator">|</span></li>
     <li><a href="http://my.link">2015</a><span class="year-seperator">|</span></li>
     <li><a href="http://my.link">2014</a><span class="year-seperator">|</span></li>
     <li><a href="http://my.link">2013</a><span class="year-seperator">|</span></li>
    </ul>

How to get the last Element of CSS?

3 Answers3