Jump to content

7.1 - Centering Site Title Between Nav Items

Recommended Posts

Site URL: http://www.kateandrewsdesign.com

Hi everyone-

I'm trying to center my navigation per this video tutorial but I'm having a slew of issues. Here's the code I'm using:

Quote

 

.header-layout-branding-center-nav-center .header-title-nav-wrapper {
  flex-basis: 100%  !important;    
  text-align: center !important; 
  height: 4vw; 
  margin-top: -2vw; 
  padding-bottom: 1vw; 
  margin-left: -2vw;

}

.header-title {
  margin-bottom: -8.5% !important; 
  margin-top: 1vw;

}

.header-nav-item:nth-child(3){
   margin-left: 63vw !important;

}

 

Sometimes it works, but usually it doesn't. It also screws up the Shopping Cart icon which moves to a different line completely. Attached a screen grab of the design/spacing I'm going for.

Thank you! Much appreciated!

http://www.kateandrewsdesign.com

Screen Shot 2020-07-08 at 5.31.55 PM.png

Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

On 7/13/2020 at 7:48 PM, sarahkleist said:

hi @tuanphan I am wondering the same thing -- i used the same code as above and it works but when I use the "scroll back" site navigation style, it sticks to the top halfway off-screen. i would like to center my logo in between four nav titles and use the "scroll back" style 

Can yo ushare site url?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 2 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.