[Solved] Menu li/ul image on third level links only

[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.

[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;
}

?

[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

[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

[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

[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;
}