Joomla Templates Club 406,261 posts

[habdul Friend habdulJoin date: October 2012Posts: 64Downloads:92Uploads:30]

#979141

Compliments of the day,

Please how do I change the color of the Main menu background color as well as the color of the active menu item?

Regards

Hassan

---

Attachments:

1. 

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#979167

Hi

If you want your mainmenu as showed in image below then add this to your custom.css

.navbar-default .navbar-nav > li > a {
    color:#ffffff!important;
}

.navbar-default .navbar-nav {
    background:#333333;
}

---

Attachments:

1. 

[habdul Friend habdulJoin date: October 2012Posts: 64Downloads:92Uploads:30]

#979219

Hello Pavit,

Thanks for your response.

1. After applying the codes you sent above, the left and right ends of the nav bar are still not affected.
2. How can the background and font color of the active menu item be adjusted?

Regards

Hassan

---

Attachments:

1. 

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#979250

Hi

Regarding main nav left and right you can apply this code to your custom.css file

.t3-mainnav {
background:#A8CF45!important;
}

Regarding active item menu , could you describe how it should behaves ? which color you want it to be ?

---

Attachments:

1. 

[habdul Friend habdulJoin date: October 2012Posts: 64Downloads:92Uploads:30]

#979431

Hello Pavit,

Thanks for your assistance.

I will like Active menu to have White Background and Green font.

Regards

Hassan

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#979437

Hi there

add below code to custom.css

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #A8CF45!important;
  background-color: #ffffff!important;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > .separator,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > .separator:hover,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > .separator:focus {
  background-color: #ffffff!important;
  color: #A8CF45!important;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > .separator:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > .separator:focus {
  color: #ffffff;
  background-color: #ffffff!important;
}

Regards

[habdul Friend habdulJoin date: October 2012Posts: 64Downloads:92Uploads:30]

#979440

Thanks a lot Pavit.

Will do that now.

Kind regards

Hassan

[Author]

Posts