Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
AKTH

Centering Navigation-Flatiron Template

Question

Love the flatiron template. Only issue is not being able to center the navigation. I would like to have either title one one centered line with navigation below, or title in center with navigation on either side (prefer). This is what I have tried entering into custom CSS below, but it did nothing. Any help very greatly appreciated! Thanks!

 

1.   #logoWrapper {display: block !important;     padding-top: 50px;
2.       margin: auto !important;}
3.   
4.   header{
5.       position: fixed;
6.       height: 200px;
7.       padding: 0px;
8.       text-align: center;
9.       
10.      border-bottom: 0px solid #999999;}
11.      
12.    #header #headerNav { 
13.      display: inline-block;
14.      margin-top: 45px;
15.      text-align: center; 
16.      margin-right:;
17.    }
18.    
19.    #headerNav nav a {
20.      padding-left: 15px;
21.      padding-right: 15px;}

Share this post


Link to post

3 answers to this question

Recommended Posts

  • 1

@AKTH Can you share site url? I just tried colin's code. It worked...

 

colin.png

 

or try (Add to Home > Design > Custom CSS)

#navigator .siteTitle {
    float: none;
    text-align: center;
    max-width: 100%;
    padding-bottom: 0;
}
#navigator header#topBar ul#nav {
    float: none !important;
    max-width: 100% !important;
    text-align: center;
}

 

Edited by tuanphan

COVID-19Free priority support for all users (29/03 - 30/04). You can tag me (@tuanphan) or send to my email.

With paid support, see here

How to Setup Password & Share URL

 

Share this post


Link to post
  • 0

Try adding the following to the custom css area, after any other code that may be there. 

#navigator .siteTitle {
    float: none;
    padding: 0;
	padding-top: 20px;
    max-width: 100%;
    text-align: center;
}
#navigator header#topBar ul#nav {
    float: none;
    padding: 0;
    margin: 0 auto;
    max-width: 100%;
    width: 60%;
    text-align: center;
}

 


Please hit LIKE to share your appreciation of posts that are helpful or useful. 

The like button is somewhere over thereover-there.jpg

Of course, Likes don't pay the bills.. If you're looking for a Squarespace Developer you can hire me here

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...