homepage full size background image has a border around it

Hi Rebecca, sorry to hear that your image isn’t expanding to the expected size!

It sounds like you’ve tried most of the normal troubleshooting steps and something else is definitely going on. Unfortunately your website is hidden behind an Under Construction page and I am unable to take a look at the page source code to see if I can find where the problem is coming from, but I do have an idea that might get things working again.

Full Width sections created with the Post and Page Builder inherit some default margin and padding rules from the Crio theme that allow them to expand the full width of the page. My current theory is that setting the margin and padding values to zero in the Advanced Controls is somehow overriding the expected defaults.

Open the Advanced Controls for that section on your home page and set the Right and Left Padding values to 20px, leave the Top and Bottom ones at zero. Then go to the Margins section and set a value of -20px (this needs to be a negative value to offset the Padding) with the Left and Right sliders, leaving the Top and Bottom at zero again.

Hopefully this solution fixes the problem you are seeing with the image, but if not then we will likely need you to temporarily disable the Under Construction mode so our team can look more closely at the page and figure this one out. Please let us know if you have any other questions for us Rebecca!

Hi Rebecca,

Thanks for the update. I can see what you mean. Right now, your top section still has a margin: 0px setting, which is overriding the correct margin for that element. The easiest way to fix this would actually be to switch to the Text Editor tab, and simply delete the margin.

Here’s how it looks now:

<div class="boldgrid-section background-scroll color-3-text-contrast color3-background-color" style="background-image: linear-gradient(to left, rgba(109, 164, 216, 0.11), rgba(109, 164, 216, 0.11)), url('https://frakercpa.com/wp-content/uploads/2021/08/6-ogBbjnD_caQ-1080x608-1.jpg'); background-size: cover; background-position: 50% 100%;  margin: 0px; padding: 0em;" data-imhwpb-asset-id="1181355" data-image-url="https://frakercpa.com/wp-content/uploads/2021/08/6-ogBbjnD_caQ-1080x608-1.jpg" data-bg-overlaycolor="rgba(109,164,216,0.11)">

And here’s how it would look with the margin taken out:

<div class="boldgrid-section background-scroll color-3-text-contrast color3-background-color" style="background-image: linear-gradient(to left, rgba(109, 164, 216, 0.11), rgba(109, 164, 216, 0.11)), url('https://frakercpa.com/wp-content/uploads/2021/08/6-ogBbjnD_caQ-1080x608-1.jpg'); background-size: cover; background-position: 50% 100%; padding: 0em;" data-imhwpb-asset-id="1181355" data-image-url="https://frakercpa.com/wp-content/uploads/2021/08/6-ogBbjnD_caQ-1080x608-1.jpg" data-bg-overlaycolor="rgba(109,164,216,0.11)">

Hi Rebecca,

You’re most certainly welcome. We’re so happy to hear you were able to get this resolved!