Subheader on Mobiles

chanti098 · February 2016

Helloo, Kindly let me know about how to remove the sub-header on Mobiles. Users are complaining about that blank blue background when viewing via mobiles!

Screenshot - http://pasteboard.co/1KssYC9i.jpg

Thanks for you time.

Albert · February 2016

Hi,

to remove this space, you need to set Minimalistic header under Theme options > Header & Subheader > Header section.

chanti098 · February 2016

Thank you for your reply, is there any option or custom css that used to hide the subheader for only mobile users?

Albert · February 2016

Please send us link to page where from you want to remove it first.

chanti098 · February 2016

this is the >> link << - Actually, i want to hide that subheader on all blog posts (and also in pages if possible) which are being viewed via Mobile Phones! Subheader needs to be hidden for mobile users only. Thanks for your time.

Albert · February 2016

Ok. So to remove subheader on mobile devices, you need to use the following css:

@media only screen and (max-width: 767px) {
    #Subheader { display: none !important; }
}

chanti098 · February 2016

Thanks alot @muffingroup team. \m/

chanti098 · February 2016

I'm extremely sorry, what i wanted to hide was the header background image on mobiles. Please provide me the css code to hide that header background of all blog posts (and pages if possible) on mobiles. thank you.

and what are the dimensions for header background image?

Albert · February 2016

Please show us on screenshot what exactly you mean because it's confusing.

chanti098 · February 2016

Really sorry for the confusion. Please check the below screenshot!

Albert · February 2016

To remove just this area, you need to use:

@media only screen and (max-width: 1024px) {
    body:not(.template-slider):not(.header-simple) #Header { min-height: 0 !important; }
}

Subheader on Mobiles

Comments