Joomla Templates Club 406,261 posts

[sky Friend skyJoin date: May 2006Posts: 283Downloads:37Uploads:2 Thanked: 1 times in 1 posts]

#1009251

when I create a menu separator, the style is not same as other menu with link. how to change it to the same style?

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1009255

Hi
yes the Separator type Menu does not have the same design its simple when u use the separator.

Add this code in custom.css file to give it same style

.nav > li > .separator:hover, .nav > li > .separator:focus {
    background: none;
    color: #ff5a00;
}

.nav > li > .separator {
border-radius: 0;
    color: #222222;
    font-weight: 400;
    font-size: 13px;
    padding: 20px;
    text-transform: uppercase;
}

Regards

[sky Friend skyJoin date: May 2006Posts: 283Downloads:37Uploads:2 Thanked: 1 times in 1 posts]

#1009292

This reply has been marked as private.

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1009294

Hi
Do u mean is there any separator Menu in the child window that not showing like other menu ?
Can you point the menu in screenshot .

[sky Friend skyJoin date: May 2006Posts: 283Downloads:37Uploads:2 Thanked: 1 times in 1 posts]

#1009408

This reply has been marked as private.

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1009413

Hi Your new request needs custom work in CSS to apply the different colour for a specific menu, you can only apply custom classes for Mega menu items. Becuase all the submenu use the same CSS classes.I suggest you use the firebug for check the style classes and override it via the custom.css file.

For the mobile Menu Replace this code from custom.css

.nav > li > .separator {border-radius: 0; color: #222222; font-weight: 400;font-size: 13px;padding: 20px;text-transform: uppercase;}

with this

@media(max-width:768px){
.nav > li > .separator {border-radius: 0; color: #fff; font-weight: 400;font-size: 13px;padding: 20px;text-transform: uppercase;}}

Regards

[sky Friend skyJoin date: May 2006Posts: 283Downloads:37Uploads:2 Thanked: 1 times in 1 posts]

#1009424

This reply has been marked as private.

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1009427

Hi
Please check my code again, its #fff you have to change the color code with your color.
Here is the class for menu dropdown

.t3-navbar-category .nav-stacked div.dropdown-menu {background:#000;color:#fff;}

Modify the color as per needs.

Regards

[Author]

Posts