Hi All,
Having trouble with my code.
Here is my menu
<% if Menu(1) %>
<ul class="firstLevel">
<% control Menu(1) %>
<li><a href="$Link" title="$MenuTitle" class="$LinkingMode">$MenuTitle</a>
<% if LinkOrSection = section %>
<ul class="secondLevel">
<% control Children %>
<li class="$LinkingMode <% if FirstLast %>$FirstLast<% end_if %>">
<a href="$Link" title="$MenuTitle" class="$LinkingMode">$MenuTitle</a>
<% if LinkOrSection = section %>
<ul class="thirdLevel">
<% control Children %>
<li class="$LinkingMode <% if FirstLast %> $FirstLast<% end_if %>">
<a href="$Link" title="$MenuTitle" class="$LinkingMode">$MenuTitle</a>
</li>
<% end_control %>
</ul>
<% end_if %>
</li>
<% end_control %>
</ul>
<% end_if %>
</li>
<% end_control %>
</ul>
<% end_if %>
problem is first level all good, and second, but when i got the the third level it uses second level class not third.
heres my style
.firstLevel li {
float:left;
border-top:1px solid #70a2f9;
border-bottom:1px solid #70a2f9;
background-color:#488bf9;
}
.firstLevel li.current,
.firstLevel li.section {
background-color:#6da2f7;
}
.firstLevel li a {
display:block;
color:#ffffff;
width:180px;
font-weight:normal;
font-size:1.4em;
text-decoration:none;
padding:10px 10px 10px 10px;
background-color:#488bf9;
background-image: url(../images/navigation.png);
}
.firstLevel li a:hover {
color:#488bf9;
background-image: url(../images/navigation_hover.png);
}
.firstLevel li.current a,
.firstLevel li.section a {
color:#edecf7;
background-image: url(../images/navigation_curr.png);
}
.secondLevel li {
float:left;
background-color:#6da2f8;
border-bottom:1px solid #70a2f9;
border-top:1px solid #70a2f9;
}
.secondLevel li.current {
color:#e1e1d5;
background-image: url(../images/navigation_third.png);}
.secondLevel li.section {
color:#e1e1d5;
background-image: url(../images/navigation_third.png);}
.secondLevel li a {
display:block;
width:180px;
color:#fff;
font-weight:normal;
font-size:1.2em;
text-decoration:none;
padding:10px 10px 10px 10px;
background-image: url(../images/navigation_sec.png);
}
.secondLevel li a:hover {
color:#fff;
background-image: url(../images/navigation_sec_hover.png);
}
.secondLevel li.current a {
color:#e1e1d5;
background-image: url(../images/navigation_sec_curr.png);}
.secondLevel li.section a {
color:#e1e1d5;
background-image: url(../images/navigation_sec_curr.png);}
.thirdLevel li {
float:left;
background-image: url(../images/navigation_third.png);
border-bottom:1px solid #70a2f9;
border-top:1px solid #70a2f9;
}
.thirdLevel li.current,
.thirdLevel li.section {
background-image: url(../images/navigation_third.png);
}
.thirdLevel li a {
display:block;
width:100px;
color:#fff;
font-weight:normal;
font-size:1.1em;
text-decoration:none;
padding:10px 10px 10px 10px;
background-image: url(../images/navigation_third.png);
}
.thirdLevel li a:hover {
color:#fff;
background-image: url(../images/navigation_third.png);
}
.thirdLevel li.current a,
.thirdLevel li.section a {
color:#e1e1d5;
background-image: url(../images/navigation_third.png);}
any help would be greatly appreciated.
THANKS :)