7 replies to this topic

[hevymetl]

Is there a way to add tags within the

tags of the main nav? for instance, instead of:

Please Login or Register to see this Hidden Content

I want this to be generated as:

Please Login or Register to see this Hidden Content

[catrina]

Rather than adding span tags to the code itself, you can create CSS that adds styles to the menu items. For example:

Please Login or Register to see this Hidden Content

[hevymetl]

My need for doing this is to create tabs with rounded corners, which would be supported on all browsers. I.E. does not have a way to create radius corners, like Firefox. Therefore, what I do is wrap the nav item as described above. This allows me to create each tab with 3 backgrounds: 1 for the left side of the tab (non-repeating image), one for the middle (repeating x), and one for the right (non-repeating). As far as I know, there is not a way to create this effect with CSS on a single li tag.

[catrina]

Have you seen this?:

Please Login or Register to see this Hidden Content

[hevymetl]

Btw, this would be an example of the CSS for the above code: /* top nav hover */ div#top ul li a:hover{ float:left; width:auto; background:url(images/nav_midlebg.gif) repeat-x 0 0; } div#top ul li a:hover span.left{ float:left; width:auto; background:url(images/nav_leftbg.gif) no-repeat 0 0; } div#top ul li a:hover span.left span.right{ float:left; width:auto; background:url(images/nav_rightbg.gif) no-repeat right top; padding:0 19px; display:block; font:bold 12px/33px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#A21827; background-color:inherit; cursor:pointer; } /* top nav active */ div#top ul li a.active{ float:left; width:auto; background:url(images/nav_midlebg.gif) repeat-x 0 0; } div#top ul li a.active span.left{ float:left; width:auto; background:url(images/nav_leftbg.gif) no-repeat 0 0; } div#top ul li a.active span.left span.right{ float:left; width:auto; background:url(images/nav_rightbg.gif) no-repeat right top; padding:0 19px; display:block; font:bold 12px/33px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#A21827; background-color:inherit; cursor:pointer; }

[catrina]

If you really need to edit the navigation code to add span tags, you will need to make sure that PlatformBase is activated.

[hevymetl]

I am currently using platformbase. I just haven't found where to modify the nav. The section.nav.php file would make sense, but I don't see any way to make the changes I am after within that code.

[hevymetl]

What code needs to be modified to make this happen?