Fix weird spacing

Hello,

Can anyone help me figure out how to fix the weird spacing on the right side of this three-column layout? I can’t figure out why there is more spacing on the right side of the main image than the far left image. It may be the left image that is off.

Any help would be appreciated! Thank you!


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi Dbisbee,

You missed sharing your read-only link. What I can guess is, you have an external or internal margin on whether the center or right children element.

I would suggest to get rid of those, set the main div/container to: Flex horizontal, Stretch, Space between, and add a gap that would work as the main spacer.

Cheers

Oh weird. Here is the link.

https://preview.webflow.com/preview/delanyandco?utm_medium=preview_link&utm_source=designer&utm_content=delanyandco&preview=40d56aa42749d5be682a8b5c24bcb446&pageId=665225c1972af8278a6d5953&workflow=preview

Dear @Dbisbee ,
looks good to me, I guess you fixed it,

Only heads-up would be to hide the 1rst and 3rd element in the landscape-mobile view as they appear as a left aligned V-Flex elements

Cheers

That’s odd. It’s still showing as asymmetric on desktop outside of the reader view.

Hello,

The issue with the uneven spacing between your elements is because the images are not taking the full width of their parent container, leaving empty space. To fix this, set the width of the images to 100%.
image

in this onei set images width to 100%:

1 Like

Thank you so much! That did it!

1 Like