Background images not scaling properly at mobile

Heyo. I’m starting my first project using Pro today. Having some trouble dealing with background images within columns - they look fine at desktop but I’m having trouble understanding the behaviour at mobile screen sizes.

Inspecting them in the browser, they are taking up the full width -and- height of their parent container. However, the background images are not tall enough and I’m left with a bunch of unwanted white space above and below the image that is being displayed.

Ultimately, what I need is to have both images stacked on top of one another at full width and also use all of the available white space for height.

The site is: https://dev.thinkrmedia.com/casasanta/

The specific section is <div class="e2-1 x-section">

Thanks!

Hi @AB_Themes,

Thank you for reaching out to us. I checked your section and I see you’ve given padding to your headline element. Please remove the padding from the headline element and give it to your columns instead to fix the issue.

Let us know how this goes!

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