Parallax in rows

Hello,

I’m using the parallax background setting in the row in PageBuilder.

The pictures display great on big screens, but on mobile there’s only a small part of the picture that is visible.

Do you have a way to solve this?
By e.g. setting the specific crop for the picture for mobile devices…

Thanks,

http://rorbu.biz/oppgradering/nb/startside/

Hi,

You can make the image to be shown fully with this Custom CSS:

@media screen and (max-width: 1024px) {
.panel-row-style {
    -webkit-background-size: contain !important;
    -moz-background-size: contain !important;
    background-size: contain !important;
}
}
  • this will leave some white space above and below the images, depending on image sizes or you can change the crop position with this Custom CSS and you will not have white space, but this will not show the full image:
@media screen and (max-width: 1024px) {
.panel-row-style {
    background-position: center top !important;
}
}

Please add the above CSS using this plugin: https://wordpress.org/plugins/simple-custom-css/ and let me know how it works.

Best Regards,
Csaba

Hi Csaba, it worked! Thank you very much!

Regards,

Hi,

Great! You’re most welcome! If you need help with anything else, please, feel free to open a new topic.

Have a nice day!

Best Regards,
Csaba