Page 1 of 1
[Solved] Menu li/ul image on third level links only
Posted: Wed Apr 02, 2008 7:29 am
by nakkiel
Hi!
I am using this as my menu (the first one):
http://wiki.cmsmadesimple.org/index.php ... ion_expand
And I was wondering how can I change the third level items so that the bullets would be arrow.jpg, here's my menu css:
Code: Select all
#menu {
background-color: #FFFFFF;
background-image: url(images/menupic1.jpg), url(images/menupic2.jpg);
background-repeat: no-repeat;
background-position: top-left, top-right;
color: #000000;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 8pt;
width: 265px;
}
li {
list-style-image: url(images/arrow.jpg);
padding-top: 5px;
}
With this I get all the li-bullets to arrow.jpg, but how can I change the third level items only to this? I have no idea how to poke around the menu manager for this, it's all gibberish to me I'm afraid.
I am using CMS Made Simple 1.2.3 "Black Rock". MySQL 5.0.45 and phpMyAdmin 2.10.1.
Thanks in advance.
Re: Menu li/ul image on third level links only
Posted: Wed Apr 02, 2008 11:26 am
by bterkuile
Do you mean
Code: Select all
#menu {
background-color: #FFFFFF;
background-image: url(images/menupic1.jpg), url(images/menupic2.jpg);
background-repeat: no-repeat;
background-position: top-left, top-right;
color: #000000;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 8pt;
width: 265px;
}
#menu ul ul li {
list-style-image: url(images/arrow.jpg);
padding-top: 5px;
}
?
Re: Menu li/ul image on third level links only
Posted: Wed Apr 02, 2008 11:58 am
by nakkiel
Almost! One level up from that, I tried various combinations of these ul/li items without success... Can you please tell me also how can I do the same but one level up in menu? And thanks for the quick answer

Re: Menu li/ul image on third level links only
Posted: Wed Apr 02, 2008 5:32 pm
by bterkuile
I believe that the #menu id belongs to a containing div, so then the third level should be:
Code: Select all
#menu ul ul ul li {
list-style-image: url(images/arrow.jpg);
padding-top: 5px;
}
I hope this answers the question
Re: Menu li/ul image on third level links only
Posted: Thu Apr 03, 2008 5:19 am
by nakkiel
Well now using that the bullets are way down the hierarchy... Here's my hierarchy:
Code: Select all
Frontpage > Section 1 > Sub section (*) > Sub section > Sub section (**)
> Section 2
> Section 3
* = Here is where I want the bullets
** = This is where the bullets are
And my page (section 1,2,3) only shows the menu starting from those sub sections, so does this mean the ul/li thingy should be the very first menu item? I have no idea. And I also noticed the bullets are also on the lower sub sections, how can I disable this?
The same in a nutshell, I want the bullets only to show on the very first menu item visible, when you are in section 1,2,3 pages...
Hope my explanation was understandable

Re: Menu li/ul image on third level links only
Posted: Thu Apr 03, 2008 6:45 am
by nakkiel
I got it! I tried out bMenu styler so I could spy on how things are done with menu stylesheets. Also I changed the the menu to cssmenu.tpl because the section_expand.tpl was buggy with IE.
Code: Select all
#primary-nav li a{
font-weight: bold;
padding-top: 5px;
}
#primary-nav li li a{
font-weight: normal;
padding-top: 5px;
}
#primary-nav li {
font-weight: bold;
list-style-image: url(images/arrow.jpg);
padding-top: 5px;
}
#primary-nav li li {
font-weight: normal;
list-style: none;
padding-top: 5px;
}