Container width change messed up formatting!

Design help General
1

I widened the width of one of my containers manually (amended the underlying code), but since that change, one of the columns is no longer aligned properly (that’s visible only when the website is published - it looks fine in the editor).

See link below (1st link is the webpage, 2nd link is the editor).

I would like for the column width to be reduced so it fits around the buttons nicely. Could you advise how to fix this issue?

Thanks!

https://mbastash2.webflow.io/home-test

Here is my site Read-Only: https://preview.webflow.com/preview/mbastash2?utm_medium=preview_link&utm_source=designer&utm_content=mbastash2&preview=4fc0fa1a2bb3c4cb077028793de7cf53&pageId=5e591393942b34f5f85eb1b4&mode=preview
(how to share your site Read-Only link)

2

A couple of things that I’d suggest for this:

  1. You don’t need code to change the width of a container, you can do it inside the designer.
  2. You’re giving your buttons a fixed width which is going to be affect every breakpoint and any size of the container, instead of using fixed sizes in pixels I’d use percentages.

Hope this helps.

3

Thanks @aaronocampo!

  1. Could you advise how to do this? When I select my container there’s no way for me to play around with margins
  2. If I give a %, then the button size reverts to just wrapping around the text (i.e. boxes end up not being of the same size, which I’d like to avoid). Could you advise how to avoid this with your approach?

Thanks again

4

I created a small video for you, hope it helps:

2 Likes
5

This is incredibly helpful. Thank you!

1 Like