CODEWITHSUNDEEP
menujoomlamenuitem
user1146452
user1146452

Reputation: 11

Customize one of menu item background on Joomla

I've been trying to customize one the menu item on the joomla template i've currently use. Some of the menu I've used before normally display item ID when you view the source code but my template doesn't display any at all. Anyhow I created the css code below hoping this will meet my goal but it didn't work. What I'm trying to accomplish is make the APPLY NOW an item #30 on my administrative main menu panel column turn the background into RED before any hover or any activities. You could view my temp link at getvms.net/home

I really appreciate if you could help me.

Thank you!

code: 

    #s5_nav li { 
    display:block;
    list-style:none;
position:relative;
float:left;
border-right:solid 1px #B6B5B5;
height:45px;
padding-left:10px;
padding-right:10px;
padding-top:9px;
padding-bottom:0px;
overflow:hidden;
}


#s5_nav li.item#30, {
    display:block;
list-style:none;
position:relative;
float:left;
border-right:solid 1px #B6B5B5;
height:45px;
padding-left:10px;
padding-right:10px;
padding-top:9px;
padding-bottom:0px;
overflow:hidden;
background:red;

Upvotes: 1

Views: 2533

Answers (3)

Waheed ur Rehman
Waheed ur Rehman

Reputation: 765

you are on right direction giving style to one item in a fine way but you have one mistake

#s5_nav li.item#30, {
display:block;

you should remove , at the end of the item#30 and you should use like this 

#s5_nav li.item#30{
display:block;

hop it will help you.

Upvotes: 1

ximo
ximo

Reputation: 1

try with:

#s5_nav li.item30{
    display:block;
    list-style:none;

Upvotes: 0

Zachary Draper
Zachary Draper

Reputation: 139

The following may work for you if you are using Joomla! 1.6 or 1.7:

You can apply a custom CSS class to a specific menu item through the Menu Manager in Joomla!. Once you have done so, you can apply a style to that class in your style sheet.

To do so, simply open the desired Menu Item in your Menu Manager, and in the right hand column click "Link Type Options" to open that panel. The "Link Style CSS" field allows you to specify the name of a CSS class you would like to be applied to that Menu Item. This will allow you to apply styles to just that single menu item.

Upvotes: 0

Related Questions