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.

General Questions /

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

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

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


Reply


6 Posts   1584 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, 1097 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 :-)