Hide background image on mobile devices

Support
#1

I am trying to hide a background image on mobile devices.
The following has no effect:

@media (max-width: 480px){
#x-section-1 {
background-image: none; !important;
}
}

#2

Hi There,

Please add no-bg-img class to your section.

After that adding this custom CSS under Theme Options > CSS:

@media (max-width: 480px){
.no-bg-img {
background-image: none !important; 
}
}

Hope it helps :slight_smile:

1 Like
#3

Unfortunately this has no effect, the background image is still there on mobile.

#4

Hi There,

Thanks for the confirmation!

Please update the CSS with this.

@media (max-width: 480px){
.no-bg-img .x-bg-layer-lower-image {
background-image: none !important; 
}
}

Hope this helps!

Thanks

#5

Thanks for the quick reply, it works :)!

#6

You’re most welcome.

#8

Hi @bjoernx,

Would you mind clarifying if the code previously added did not work as you have previously mentioned that it worked.

I have also checked your site but I cannot find a background image on the homepage.

Thank you.

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.