Sub-item active state css

Sub-item active state css was created by Katfun

Posted 11 years 6 months ago #6042
Hi
I'm developing a website, you can check it here - 94.46.8.45/~printcri/index.php/es/print-criativa/quem-somos

and I'm using accordeon CK menu. I've styled the menu on the template css, and everything is working as expected except for the active state on the sub-itens of the menu...i've tried several things in the css but without success.
Can you help me? Basically i want to give a style to sub-itens when they are active... (all the sub-itens will have the same style).

Follows the css for the menu i've created:

/*
MENU---- */
#menu {
float: left;
width: 235px;
}
#menu ul {
margin: 0px;
padding: 0px;
text-align: left;
}
#menu ul li {
display: block;
list-style-type: none;
list-style-image: none;
}
#menu ul li a {
display: block;
padding: 5px;
width: 225px;
text-transform: uppercase;
color: #FFF;
background-color: #333;
font-size: 14px;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #FFF;
}
#menu ul li a:hover {
text-decoration: none;
}
#menu ul li:nth-child(1) a {
background-color: #f29400;
}
#menu ul li:nth-child(2) a {
background-color: #e2001a;
}
#menu ul li:nth-child(3) a {
background-color: #e2007a;
}
#menu ul li:nth-child(4) a {
background-color: #009ee0;
}
#menu ul li:nth-child(5) a {
background-color: #172983;
}

#menu ul li ul li:nth-child(1) a,
#menu ul li ul li:nth-child(2) a,
#menu ul li ul li:nth-child(3) a,
#menu ul li ul li:nth-child(4) a,
#menu ul li ul li:nth-child(5) a,
#menu ul li ul li:nth-child(6) a,
#menu ul li ul li:nth-child(7) a,
#menu ul li ul li:nth-child(8) a,
#menu ul li ul li:nth-child(9) a,
#menu ul li ul li:nth-child(10) a {
display: block;
text-transform: none;
color: #000;
font-size: 12px;
padding-top: 5px;
padding-right: 20px;
padding-bottom: 5px;
padding-left: 10px;
text-decoration: none;
float: left;
width: 220px;
background-color: #EEEEEE;
}
#menu ul li ul li a:hover {
display: block;
text-transform: none;
color: #172983;
font-size: 12px;
text-decoration: none;
background-color: #E3E3E3;
}
by Katfun

Please Log in or Create an account to join the conversation.

Replied by ced1870 on topic Sub-item active state css

Posted 11 years 6 months ago #6043
Hi
if you want to style the active items, use the class "active"
li.active
you can use firebug to help
Ced

Joomlack Webmaster and Developer

by ced1870

Please Log in or Create an account to join the conversation.

Replied by Katfun on topic Sub-item active state css

Posted 11 years 6 months ago #6044
Thanks for the help-..i've figured out!
by Katfun

Please Log in or Create an account to join the conversation.

Time to create page: 0.635 seconds

Fast and powerful creation, customizable and responsive.

Read More

We have 808 guests and no members online