Joomla Templates Club 406,261 posts

[oharris3 Friend oharris3Join date: June 2011Posts: 87Downloads:60Uploads:16 Thanks: 6 Thanked: 2 times in 1 posts]

#193659

I am using mega menu and wish to add a vertical divider (bonus menu) to distinguish between the columns in sub-menu. See demo at: http://2014.icac.org.jm/
How can I do this?

[Css Magician Friend Css MagicianJoin date: October 2014Posts: 741Downloads:43Uploads:53 Thanks: 114 Thanked: 366 times in 263 posts]

#518217

Please open templates/ja_appolio/css/custom.css file (if this file doesn’t exist, just create one in the same folder) and add the following CSS rule:


.t3-megamenu .open > .mega-dropdown-menu > .mega-dropdown-inner > .row > .mega-col-nav {
border-left: 1px solid #ddd;
padding: 20px;
}

.t3-megamenu .open > .mega-dropdown-menu > .mega-dropdown-inner > .row > .mega-col-nav:first-child {
border-left: 0;
}

.t3-megamenu .mega-nav > li a, .t3-megamenu .dropdown-menu .mega-nav > li a, .t3-megamenu .dropdown-menu .mega-nav > li .separator {
padding-left: 0;
}


That should help to add a vertical divider you mentioned.

1 user says Thank You to Css Magician for this useful post

1. oharris3

[oharris3 Friend oharris3Join date: June 2011Posts: 87Downloads:60Uploads:16 Thanks: 6 Thanked: 2 times in 1 posts]

#518286

Great! Worked fine. However, “pading: 20px;” should be “padding: 20px;”

1 user says Thank You to oharris3 for this useful post

1. Css Magician

[Author]

Posts