Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

Add a class to the last <li> in my navigation


Go to End


6 Posts   2453 Views

Avatar
Big Bang Creative

Community Member, 92 Posts

13 August 2009 at 4:07am

Edited: 13/08/2009 4:08am

I have navigation which has a pipe.... a background image positioned right on the <li>

Is there some code I can add that will add a class to the last <li> in my navigation so I can remove the background image on the last one?

Avatar
martimiz

Forum Moderator, 1391 Posts

13 August 2009 at 4:21am

You could use the <% if Last %> ... <% end_if %> structure in your template. This link might be helpful: http://doc.silverstripe.com/doku.php?id=built-in-page-controls

Avatar
Howard

Community Member, 215 Posts

13 August 2009 at 9:21am

You can just include $FirstLast as a class inside your normal control and it will add in 'First' and 'Last' to the respective items in the menu.

Avatar
Big Bang Creative

Community Member, 92 Posts

13 August 2009 at 11:17pm

Edited: 13/08/2009 11:19pm

Thanks for the replies.

howardgrigg how can use $FirstLast then. This is my menu:

<ul>
 	<% control Menu(1) %>	  
  		<li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle</span></a></li>
   	<% end_control %>
 </ul>

Thanks
Ashley

Avatar
Howard

Community Member, 215 Posts

13 August 2009 at 11:26pm

You can just go:

<ul> 
   <% control Menu(1) %>    
      <li class="$FirstLast"><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle</span></a></li> 
   <% end_control %> 
</ul>

Then target in CSS with something like
ul li .Last{
   	background-image: none;
}

Hope that helps :)

Avatar
Big Bang Creative

Community Member, 92 Posts

15 August 2009 at 4:11am

Yea that is exactly what I needed, thanks.

I tried this orginally but it did not work, turns out it was cached :-)