I am trying out the css3 mega menu for the first time and I am finding the styling options very limited in the module panel and the CSS overrides not that easy to find.
I need a different 'active' state colour to the 'hover' state colour and I also would like to be able to use underline with a margin between the menu tabs when you hover. You can find an example of the simple hover effect here:
www.aclawnandgarden.com.au/
. It has a very smooth underline effect.
The site is not online, in early development stages at the moment. Some styling guidance/overrides would be great.
Hi Lene
Thank you for contacting and choosing our product
1: with problem background hover active
please go to back-end modules -> tab Advanced -> Custom css and add code:
.none #js-mainnavcss3 .active, #js-meganav-off-canvas .active {
background: #ced59f;
}
with #ced59f is color you want
2: with problem underline tab
please go to back-end modules -> tab Advanced -> Custom css and add code
.none .megamenu ul.level0 li.megacss3 a.megacss3:hover, .megamenu ul.level0 li:hover, #js-mainnavcss3.megamenu ul.level0 > li.megacss3:hover > a.megacss3 {
border-bottom: 5px solid #1d1a1a;
}
with 5px is "px" you want
with #1d1a1ais color you want
Hope you understand
If still having problems, please contact us, pleased to assist you
Thanks
CSS styling - CSS3 mega menu
