Custom CSS for mobiles is not working

Zapa · September 2018

Hi!

I'm trying to reduce the height of the header in pages where there's not a slider (actually all but the home page) but only for mobile devices since bigger screens shows a proper height.

For that I am including this code at the Custom CSS & JS section.

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

But the code is not even appearing in the inspector.

Example link is https://www.streamyng.com/blog

What's wrong? Thanks!

Pablo · September 2018

Hi,

It code would work, but you forgot to close a media tag.

Please, paste this code into Theme Options > Custom CSS & JS > CSS


@media (max-width: 767px){
body:not(.template-slider):not(.header-simple) #Header {
min-height: 118px !important;
 }}

Thanks

Zapa · September 2018

Perfect! Now it works nicely. Thanks for the fast answer!

Custom CSS for mobiles is not working

Comments