Menu CSS not showing correct

[Ruud]

Y'r welcome,

Hope to see the result in the showcase forum some day.

Ruud

[daydreamer]

Thanks got it sorted working with this

<?php show_menu2(2,SM2_ROOT,SM2_ROOT,SM2_TRIM, '<li>[a]<span>[menu_title]</span></a>','</li>'); ?>

Thanks Ruud

[daydreamer]

Looks like this

<div id="menu">
   <ul class="menu-top"><li><a><span>new</span></a></li></ul>
</div>

No link there

[Ruud]

But for some strange reason the menu items are not linking???

Have a look at the generated source of the page to see what is wrong.
It should display something like:

Code Select Expand

<ul class="menu-top">
  <li class="menu-current menu-first"><a href="http://www.yourserver.com" target="_top"><span>Home</span></a></li>
  <li class="menu-sibling"><a href="http://www.yourserver.com/pages/faq.php" target="_top"><span>Faq</span></a></li>
  <li class="menu-sibling"><a href="http://www.yourserver.com/pages/contact.php" target="_top"><span>Contact</span></a></li>
</ul>


So a bit simplified:

Code Select Expand

<li><a href="url"><span>text</span></a></li>
If it looks like that, and still doesn't work... give us a link so we can see what is going on.

Ruud

[daydreamer]

Thanks Ruud
This worked
<?php show_menu2(1,SM2_ROOT,SM2_ROOT,SM2_TRIM,'

• [a]<span>[menu_title]</span></a>','</li>'); ?>
  
  But for some strange reason the menu items are not linking???

[Ruud]

The 4th parameter of the show_menu2 function is wrong. That might give some unexpected results.

Code Select Expand

<?php show_menu2(0, SM2_ROOT, SM2_START, '<ul>' , '<li id="menu">[a][menu_title]</a>', '</li>' , '</ul>', '', ''); ?>
See: http://code.jellycan.com/files/show_menu2-README.txt

Just a guess here...but I doubt that you want to use the square brackets around your A tag. Use <a> instead of [a].

Using the [a] instead of<a> will add the show_menu classes to the <a> tag that is generated. Nothing wrong with that.

Hi This is my menu CSS how do I get menu to display correct?

The CSS is styled using the "Sliding Doors" technique.
For this the link must be in a span tag.

An example to do that using show_menu2 is:

Code Select Expand

<?php show_menu2(1,SM2_ROOT,SM2_ROOT,SM2_TRIM,'[li][a]<span>[menu_title]</span></a>','</li>'); ?>

If this is put in within a <div id="menu"> </div>, it might just work.

Ruud

Edit: Here is a nice article on the Sliding Doors menu technique. Good for trying to understand how CSS works for you.

[marathoner]

Yup...a link would be helpful. Also, more helpful to know what you "want" it to do rather than use the term correctly since I'm sure that it's already displaying "correctly" based on how it's currently set up.

Just a guess here...but I doubt that you want to use the square brackets around your A tag. Use <a> instead of [a].

Also, I'd guess that you want to use the CSS ID "menu" around the whole menu and not at each LI tag.

[erpe0812]

Hi,

a link to your site woudl be helpful to see what's wrong.

rgds

erpe

[daydreamer]

Hi This is my menu CSS how do I get menu to display correct?
I am using,
<?php show_menu2(0, SM2_ROOT, SM2_START, '<ul>' , '<li id="menu">[a][menu_title]</a>', '</li>' , '</ul>', '', ''); ?>

#menu {
   float:left;
   width:695px;
   font-size:93%;
   line-height:normal;
   border-bottom:1px solid #666;
   }
#menu ul {
   margin:0;
   padding:10px 10px 0 50px;
   list-style:none;
   }
#menu li {
   display:inline;
   margin:0;
   padding:0;
   list-style-type: none;
   }
#menu a {
   float:left;
   margin:0;
   text-decoration:none;
   background-image: url(/templates/home/images/tabs_left.png);
   background-repeat: no-repeat;
   background-position: left top;
   padding-top: 0;
   padding-right: 0;
   padding-bottom: 0;
   padding-left: 9px;
   }
#menu a span {
   float:left;
   display:block;
   padding:5px 15px 4px 6px;
   color:#FFF;
   background-image: url(/templates/home/images/tabs_right.png);
   background-repeat: no-repeat;
   background-position: right top;
   }
   
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#menu a span {float:none;}
/* End IE5-Mac hack */
#menu a:hover span {color:#FFFFFF;}
#menu a:hover {background-position:0% -42px;}
#menu a:hover span {background-position:100% -42px;}