Hi, just purchased the Newspaper theme a few days ago…everything looks good, but I have a question about the Mobile Menu Header. I’ve noticed that it blends in with the footer as both are the same color. Is there some custom code that I could enter that would put a shadow under it like it does when you choose the default header style. Here is a link to my website so you can see what I’m referring to: http://www.thecountryman.ca
Thanks.
Hello,
You can try to add a bottom border to the main menu like so:
@media(max-width:767px){
.td-header-wrap{
border-bottom: 2px solid grey!important;
}}
Add the code in the theme panel-> custom css box.
You can change the color of the border to one you prefer.
Thank you!
Thanks for that, but I would like it to be the same style as the default header style with the mobile header (seems to be a shadow under)
Hello,
If you want to add the exact same shadow as the header style 1 shadow, you can use a biox shadow like so:
.td-header-menu-wrap-full{
-webkit-box-shadow: 0px 6px 6px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 6px 6px 0px rgba(0,0,0,0.15);
box-shadow: 0px 6px 6px 0px rgba(0,0,0,0.15);
}
Add the code in the theme panel->custom css box.
Thank you!
Thanks, that works for the menu header on all screen sizes, but not when the menu header becomes sticky.
Sorry, what I would like is for that shadow to take effect only with the mobile header.
Hello,
The sticky menu is separate from the main menu. It will not work in it;s current form on the sticky menu.
if you want to affect only the mobile version with the code I provided, then add it in the advanced css box under mobile phones: https://www.screencast.com/t/qnaXteSKRUT
If you want the code to also affect the sticky menu, please use this code instead:
.td-header-menu-wrap-full, .td-affix{
-webkit-box-shadow: 0px 6px 6px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 6px 6px 0px rgba(0,0,0,0.15);
box-shadow: 0px 6px 6px 0px rgba(0,0,0,0.15);
}
Thank you!