handac handac - 4 months ago 6
CSS Question

padding of the navbar in squarespace

I'm building a website with squarespace but having some trouble with the top navbar which is too far from the logo/main title on the same line.

So the idea close the gap between navbar and logo (let's say 30% padding from the top left and top right)

I've found that the css to be used here but I'm not quite sure which "id" to use

.navbar-nav > li{

From inspector I'm a little bit confused, so would appreciate any help !

Here the website link to see the code : https://handa-cheng-a3wm.squarespace.com/1starrondissement

And the code :

<div class="Header-inner Header-inner--top" data-nc-group="top">
<div data-nc-container="top-left">
<nav class="Header-nav Header-nav--primary sqs-frontend-overlay-editor-widget-host" data-nc-element="primary-nav" data-content-field="navigation" id="yui_3_17_2_3_1466525273564_799">
<div class="Header-nav-inner" id="yui_3_17_2_3_1466525273564_2568">
<a href="/see-paris/" class="Header-nav-item">看巴黎</a><a href="/listen-paris/" class="Header-nav-item" id="yui_3_17_2_3_1466525273564_2567">听巴黎</a>

<div data-nc-container="top-center">
<a href="/" class="Header-branding sqs-frontend-overlay-editor-widget-host" data-nc-element="branding" data-content-field="site-title">


<div data-nc-container="top-right">

<nav class="Header-nav Header-nav--secondary sqs-frontend-overlay-editor-widget-host" data-nc-element="secondary-nav" data-content-field="navigation" id="yui_3_17_2_3_1466525273564_811">

<div class="Header-nav-inner">
<a href="/about-us/" class="Header-nav-item">我们是谁?</a><a href="/contact-us/" class="Header-nav-item">联系我们</a>



Adding the following CSS to the CSS Editor will do what you want.

.Header-nav--primary {
  margin-left: auto;
  margin-right: 5%;

.Header-nav--secondary {
  margin-right: auto;
  margin-left: 5%;

You can of course adjust the 5% as desired.

More information regarding flex + margin here.