Change padding of navigation links container in 7.1

Site URL: https://chiton-coral-83de.squarespace.com/

I'm wondering how to change the spacing on either side of the navigation links so it's wider? At the moment, the area for navigation links seems very narrow. You can see in this GIF that when I make the screen wider, it becomes slightly wider, then narrow again. Happy to use code if need be. 

GIF: https://share.getcloudapp.com/6quewQmG

https://chiton-coral-83de.squarespace.com/

Pass: pearler

Thanks!

Add to Home > design > Custom CSS

.header-layout-nav-center .header-nav {
    flex: 1 1 100%;
    width: 100%;
}

Thanks! The result isn't centred, however. Do you know how to help center it? 

Same issue, I have been holding off on fixing the navigation for a few months because I was hoping this would eventually get addressed, but no luck.  I've tried code from this thread and this thread 

- but ultimately  - the only code that keeps everything on single line makes the links go off center. Super frustrating.  I would argue that most people want the navigation on a single line and not stack.

On 12/19/2020 at 2:12 AM, spaded said:

Same issue, I have been holding off on fixing the navigation for a few months because I was hoping this would eventually get addressed, but no luck.  I've tried code from this thread and this thread 

 

 

 

- but ultimately  - the only code that keeps everything on single line makes the links go off center. Super frustrating.  I would argue that most people want the navigation on a single line and not stack.

Can you share site url? We can check easier.