Unexplained margin/ flex not justified

Design help General
1

Hi all!

I’m hitting an issue with my NavBar where my logo is not sitting as far to the left as I would like it to. It’s in a flex, 100vw section and I’ve gone through three times checking margins, and I can’t figure out how to get it to sit closer to the left edge (like, equivalent to the space on the right of the nav links).

Thank you!
Ashley

Here is my site Read-Only: https://preview.webflow.com/preview/fat-puppy-marketing?utm_medium=preview_link&utm_source=dashboard&utm_content=fat-puppy-marketing&preview=b50582ca6e67f87b19cd6b7a72d15b83&mode=preview

2

Set its flex sizing to grow if possible.

1 Like
3

Hi @fatpuppy,

What’s your reason for using flex in the navbar?

Simple solution below;

  1. Add a new navbar from the left components menu in designer
  2. Add a new div block before the container that’s inside the navbar
  3. Move the following to the new div block; brand link block, nav menu, menu button
  4. Delete the empty container
  5. Add the logo to the new brand link block
  6. Add padding where necessary

No need to use flex unless you’re adding an extra column(s).

See 2 attached images below.

00
00751×921 306 KB

21
211721×924 422 KB

Hope this helps.
Naweed

4

Actually if you looked at it you would see that I had removed the container. I believe I used flex to create the space between the logo and links, without needing to use padding between them (which I tried, but even when set to a vw rather than px was still interfering with full responsiveness).