0

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) squarespace

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

.navbar-nav > li{
  padding-left:30%;
  padding-right:30%;
}

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>
    </nav>
  </div>
  <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">巴黎，Paris</a>
  </div>
  <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>
      </div>
    </nav>
  </div>
</div>
ghost_dad
  • 1,308
  • 2
  • 12
  • 21
handac
  • 13
  • 1
  • 6

1 Answers1

0

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.

Community
  • 1
  • 1
Brandon
  • 3,572
  • 2
  • 12
  • 27