Background color height

Say, on this page. https://natlvtn.org/fremont-veterans-memorial-park/. We have a red background with a red button that says Donate Today. We like a little space above and below the button. However, on a smart phone this pace enlarges quite a bit. Is there a way when on a mobile device the space above the button and below can be a lot less.

Thank you.

Hi there,

Those extra spaces on mobile are the blank columns on the left and right of the button on desktop that gets stacked to the top and bottom part of the button column on mobile.

To get rid of the space, select the column and click on the customize option then you should see the Hide During Breakpoint option. You can then hide the empty columns on mobile using that option.

I actually still want the image to show up. When I select the breakpoint it makes the image go away. Any other suggestions.

Hello @rkassebaum,

Thanks for asking. :slight_smile:

I see something quite weird in your website. To center align the button, it seems that you are using 3 column layout. First and third column being empty. On desktop you are not seeing the issue as button is perfectly aligning, but on mobile those empty columns are adding the space. Upon deleting the empty section it fixes the problem. Here is screencast. https://cl.ly/2N3Q2N0e0Y2B

What I would suggest you is instead of using 3 column layout, use one column layout. After that to center align the button, you can do that from Section > Formatting > Click Center Icon. And that will automatically fix the problem you are facing on mobile as well as it will be lot easier to maintain in future. I have recorded a screencast that you can take a look. https://cl.ly/1H153S2A1u0F

Thanks.

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