Pro: remove background image on mobile

Support
#1

Hello see this page:

http://staging1.kidsmagicworld.com.au/kids-magician/

how do I remove the background image on mobile devices- I cannot find the css using firebug

#2

Hi @b960a518-a049-4215-9,

Thanks for writing in.

Upon checking your setup, background image does not show on your mobile device. If still showing at your end, you could use the suggestion below.

Use this code in your custom CSS to remove background for mobile or screensize below 979px:

@media (max-width: 979px){
    .x-root .site, .x-root .x-site{
         display:none;
     }
}

Let us know how it goes.

Thanks.

#3

this removes everything but the background as in all content on mobiles

#4

Hi @b960a518-a049-4215-9,

Sorry I have combined what I about to suggest.

Use this code below:

@media (max-width: 979px){
    .x-root .site, .x-root .x-site{
         background:white;
     }
}

or

@media (max-width: 979px){
    .backstretch{
         display:none;
     }
}

Hope it helps.

Let us know how it goes.

Thanks.

#5

this one
@media (max-width: 979px){
.x-root .site, .x-root .x-site{
background:white;
}
}
worked- thank you

#6

You are most welcome!

#7

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

#8

Hello There,

This code should get rid of the background image in smaller screens:

@media (max-width: 979px){
    body .backstretch{
         display:none;
     }
}

Please let us know how it goes.