Page 1 of 1
Trouble Styling Top Navigation
Posted: Sat Nov 11, 2006 8:50 am
by DiZZ
Hi All,
I've set up my top navigation as a with the display property set to inline. I've also set the 'border-right:1px solid #fff' so that the border of each serves as a separator. The problem (as you may have already guessed) is that the last has a right border and it should not (nothing to separate!).
Normally I would set a class of .last and remove the border, but I cannot seem to access the HTML as it is buried in the smarty tags. Is there any way to remove the border without adjusting the .php files? Or does anyone have another suggestion for '1px solid white' separators in my
Thanks in advance!
Re: Trouble Styling Top Navigation
Posted: Sat Nov 11, 2006 10:05 am
by tsw
ul > li:first-child
{
border:0;
}
ul li {
border-left:1px solid red;
}
would work (well not in IE)
or you could modify the menumanager template to give some class to the last menu item.
something like {if $count == $node->hierarchy) class="last" {/endif} (untested, and that idea only works for first level menu)
Re: Trouble Styling Top Navigation
Posted: Sat Nov 11, 2006 7:45 pm
by DiZZ
Thanks tsw, I'll give it a try and let you know how it goes. Only 1st level nav - so the latter should work...
Re: Trouble Styling Top Navigation
Posted: Sat Nov 11, 2006 8:20 pm
by DiZZ
TSW -
I'm having trouble figuring out where to place the {if} statement in 'simple_navigation.tpl'. Here's the code for the file:
Code: Select all
{if $count > 0}
<ul>
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true}
<li class="currentpage"><h3>{$node->menutext}</h3>
{elseif $node->parent == true}
<li class="activeparent"><a class="activeparent" href="{$node->url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}><dfn>{$node->hierarchy}: </dfn>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
<li class="sectionheader">{$node->menutext}
{elseif $node->type == 'separator'}
<li class="separator"> <hr />
{else}
<li><a href="{$node->url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}><dfn></dfn>{$node->menutext}</a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
I've created a class in my stylesheet called '.last' with a border property set to 0. Any ideas on how to implement this?