Hello Tagdiv Team.
How do I create a shadow around the white sub-menus so that it stands out from the white landing page background? Also how about the sub-menu colors?
http://dev.foodnewsinternational.com
Thanks.
Hi
You can style the the sub-menus using custom css like here: http://screencast.com/t/VXRHTVEAKq and you can change the style properties as you like, and here are a few example: https://css-tricks.com/almanac/properties/b/box-shadow/ Also if you want to create your own shadow here are a lot of useful information: http://www.w3schools.com/css/css3_shadows.asp The classes remain the same, just properties must be change if you want to customize.
.white-menu #td-header-menu .td-normal-menu .sub-menu{
-moz-box-shadow: inset 0 0 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000;
box-shadow: inset 0 0 10px #000000;
}
To change the submenus color use this classes .white-menu #td-header-menu .td-normal-menu .sub-menu and set the background color as you want.
Thanks!
Thanks. I managed to fix the Main Menu drop down. How about the top menu drop down?
When I click “About Food News International”, the dropdown menu showing “Editor: Sheila Wan” appears. Which classes do I edit?
Hi
If you want to customize the top menu drop down you need to affect this classes: .td-header-sp-top-menu .top-header-menu .sub-menu
Thanks!
Thanks. It works.
Here is the Custom CSS Code for others to use:
.white-menu #td-header-menu .td-normal-menu .sub-menu {
-webkit-box-shadow: -6px 10px 6px -6px rgba(0, 0, 0, 0.4);
-moz-box-shadow: -6px 10px 6px -6px rgba(0, 0, 0, 0.4);
box-shadow: -6px 10px 6px -6px rgba(0, 0, 0, 0.4);
background-color:#F2F2F2;
}
.td-header-sp-top-menu .top-header-menu .sub-menu {
-webkit-box-shadow: -6px 10px 6px -6px rgba(0, 0, 0, 0.4);
-moz-box-shadow: -6px 10px 6px -6px rgba(0, 0, 0, 0.4);
box-shadow: -6px 10px 6px -6px rgba(0, 0, 0, 0.4);
background-color:#F2F2F2;
}
