Column background and Section background images not displayed on mobile

[crbasford]

I am using the column background image option to fill a column on my website. This also affects the section background image on the “about” page as well. The effect was to have text on one side and an image block on the other. On the desktop it displays fine, but on mobile the images are missing or just show a very fine line despite having used gaps to make sure it shows. I have added gaps so that the images should be visible and space should be allotted for them. What am I missing? Is this just a glitch with the new update or am I doing something wrong?

Mobile specific problem

These are a few pages I am having the problem on although there are others as well.

fbcoceanway.org
fbcoceanway.org/about

[thai]

Hi There,

To fix this issue, please add this custom CSS under Theme Options > CSS:

@media (max-width: 767px){
     .x-section .x-container.marginless-columns>.x-column[class*="x-"] {
         float: left;
     }
}

Regards!

[crbasford]

@thai

@media (max-width: 767px){
.x-section .x-container.marginless-columns>.x-column[class*=“x-”] {
float: left;
}
}

If I do this though, wont it limit the responsiveness on desktop? The glitch is only occurring on mobile version. I dont want to affect the desktop version if possible. Also can you clarify why this is happening when it is a built in feature. Was it user error or is it actually just a glitch?

[ruenel]

Hello @crbasford,

This code given by @Thai will only affect the smaller screen less than 768 pixels. Most probably this will only take effect on the ipad and other much smaller screens.

Hope this explains it briefly.