Jump to content

navigation word spacing

Go to solution Solved by tuanphan,

Recommended Posts

Any custom CSS for decreasing the word spacing between items in the navigation? I like the typeface I'm using for it (source code pro), but some navigation items have two words and they're so far apart they look like seperate links. I switched my body text font for the same reason. If that's something that can be globally adjusted in CSS I'd like to do that as well. 

I'm running on a personal plan, site is under construction [hence the lack of link].

 

Link to comment
  • Replies 8
  • Created
  • Last Reply

Top Posters In This Topic

Add to Design > Custom CSS

@media screen and (min-width:769px) {
body:not(.touch-styles) .nav-wrapper nav>div+div {
    margin-left: 30px;
}
}

 

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
div#mainNavWrapper span {
    word-spacing: 33px;
}

or you mean letter, use this

div#mainNavWrapper span {
    letter-spacing: 33px;
}

 

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
  • Solution
7 hours ago, NeighborhoodOverlord said:

It's the first one but it only changed the word spacing on the first entry. I saved and refreshed the page but it didn't affect any of the other links

try editing 

div#mainNavWrapper span

to

 

div#mainNavWrapper *

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

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.