How to remove drop shadow from header menu

Sydney Pro
#1

Hello,

Please let me know how can I remove the drop shadow from my top menu. I want all the pages like home page header menu.

https://roy2018.clippingoutsource.com/ you can see there is no drop shadow under the main menu. But when I visit other pages, I see drop shadow under the menu bar. For example:

https://roy2018.clippingoutsource.com/register/

I want to remove the drop shadow, please.

#2

Hello there,

You could easily remove it with this few lines of CSS code:

#masthead.site-header {
    -webkit-box-shadow: unset;
    -moz-box-shadow: unset;
    box-shadow: unset;  
}

Add it to Appearance > Customize > Additional CSS from dashboard.

Regards,
Kharis

#3

Thank you very much. It works and I used the CSS in my CSS snippet plugin. Is this fine for future?

#4

Yes, it could fine. However I’d strongly recommend you use Additional CSS feature in the Appearance > Customize panel. Use core features instead extra plugin’s.

Regards,
Kharis

#5

Thank you very much for your suggestion. You can see I have customized other things in my website as well. I used their CSS code there. Can I use all of the CSS features in Appearance> Customize panel. Because I was afraid if a new upgrade is there for theme or Wordpress and if I lost the settings then everything will be lost.

#6

Hello there,

All configurations in the customize panel including CSS code are tied with current active theme. Theme update won’t swipe them out. Unless the theme is changed to another else. Or the folder name is changed.

Regards,
Kharis