Joomla Templates

I am working with Transparent Bliss 3 and moved a menu to the top-nav section of the template. I need to add a separator to the menu but when I do it shows up in a completely different font and does not look like a menu but regular text. When I view the source, it says that this item is of class "separator" The image should be attached below.

Hello jlcarpenter,

Welcome at JoomaBear.com :-)
Sorry, but there is no image attached ;-) Can you try it again?

Regards,

GermanBear

have you a link to your site, or can you tell me what you done exactly? Then I can build it on my test-site.

the link is seastar.nfshost.com

thank you... But I'm not understand what you have done or what you exactly mean with separator.

You use Skype or ICQ? When you have it, it is easier when you contact me over it.

Regards,

GermanBear

hello again,

I think I understand now what you mean ;-)

I'm not understand complete what you have done for the separator, but I would make it so:

Go in the backend, then under Extensions >> Template Manager >> Transparent Bliss 3 >> Edit CSS

There you search the lines:

.menu_sf a {
color:#E8E8E8;
display:block;
height:auto;
line-height:40px;
padding-left:10px;
padding-right:10px;
text-decoration:none;
border-right:1px solid #fff;
}

and add the red marked line...
The the image I attached :-)

Hope it helps.

Regards,

GermanBear

Let me explain what I am trying to do. Each of the 3 items in the navigation bar are top level items. I want the courses item to simply be a drop down that when hovered over it shows "sub categories" (i.e. no link). To do this I marked "Courses" as a separator in the menu section of the backend. I have now added sub items under diving to give a better idea of my intentions. Currently I have Diving linked to a Category/Blog but would also like to have it do the same.

Please add this in template.css


.separator {
display: block;
padding-left:10px;
padding-right:10px;
font-weight: bold;
line-height: 40px;
text-decoration:none;
color:#E8E8E8;
height:auto;
}

Regards,

GermanBear

When you want to use the white border on the right site, add this:

.separator {
display: block;
padding-left:10px;
padding-right:10px;
font-weight: bold;
line-height: 40px;
text-decoration:none;
color:#E8E8E8;
height:auto;
border-right:1px solid #fff;
}

It will look like the picture I attached.

Regards,

GermanBear

that solved it. Thanks for the help.

No Problem. :-)