Remove header and header background image when browsing from mobile

tareqkhatib

Hello,

My desktop version is working fine, I am only targeting to fix this on my mobile device when the site is responsive.

I would like to delete the header and the background image when accessing the site from a mobile device.

.

If i delete the background image only, I will see a black thick bar on my mobile, if i kept the image, I will see the image and black line.

If possible, could you please guide me how to delete the background image and the header only when using the mobile friendly site. 

Albert

Hi,

to remove header background on mobile devices, please use extra css:

body:not(.template-slider):not(.header-simple) #Header { min-height: 0 !important; }

But we do not understand how exactly you want to remove header on mobile as well? Do you mean whole header where logo, search, action bar items are? So you just leave the content that starts from subheader?

Merry Christmas

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

tareqkhatib

Thank you,

It worked, 

Maybe i did not explain what i wanted exactly, but your solution did fix my problem.

I just wanted the header image and the background of the header image to be gone. and the script above did the job.

Merry Christmas to your too :-)

Albert

We are glad to hear that above extra css did the job

Learn more: Video Tutorials | How To | FAQ Vote on what comes next