Adding a border above navigation links in 7.1

Site URL: https://www.codasevents.com/home-new

Hi there! 

I'm trying to add a 1pt white border above this site's navigation links that spans the full width of the header, however, the code that I used to achieve this in 7.0 is not working in 7.1.

I've been able to add the border below the navigation links (screenshot attached), but would like to mirror this above the links as well to separate them from the header branding.

Any tips would be appreciated – thanks so much! 

9 hours ago, lindsayscholz said:

Site URL: https://www.codasevents.com/home-new

Hi there! 

I'm trying to add a 1pt white border above this site's navigation links that spans the full width of the header, however, the code that I used to achieve this in 7.0 is not working in 7.1.

I've been able to add the border below the navigation links (screenshot attached), but would like to mirror this above the links as well to separate them from the header branding.

Any tips would be appreciated – thanks so much! 

Hi. YOu mean add line here?

Yes, exactly that! Thanks so much.

On 5/26/2021 at 4:48 AM, tuanphan said:

Hi. YOu mean add line here?

18 hours ago, lindsayscholz said:

Yes, exactly that! Thanks so much.

 

 

 

Add to Design > Custom CSS

/* Nav line */
.header-layout-branding-center-nav-center .header-title-nav-wrapper {
    flex: 100% !important;
    flex-direction: column;
    width: 100% !important;
}
.header-display-desktop {
    flex-direction: column;
}
.tweak-fixed-header .header .header-announcement-bar-wrapper {
    padding-left: 0;
    padding-right: 0;
}
.header-nav {
    width: 100%;
    border-top: 1px solid white;
    padding-top: 15px;
}

Hello! I was wondering if we could do the same but above a one line nav? 

On 3/24/2023 at 9:09 AM, ZenMondays said:

Hello! I was wondering if we could do the same but above a one line nav? 

Yes. I guess possible. But if you share your site url, we can check easier

Hi there, I've used this method but in doing so, my cart has dropped underneath the links. Is there a way to fix this? Thanks!

1 hour ago, StudioPerkyNZ said:

I've used this method but in doing so, my cart has dropped underneath the links. Is there a way to fix this?

Please post the URL for a page on your site where we can see your issue.

A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

We can then take a look at your issue.

You may find How to post a forum question post useful.

On 5/28/2021 at 7:06 AM, tuanphan said:

Add to Design > Custom CSS

/* Nav line */
.header-layout-branding-center-nav-center .header-title-nav-wrapper {
    flex: 100% !important;
    flex-direction: column;
    width: 100% !important;
}
.header-display-desktop {
    flex-direction: column;
}
.tweak-fixed-header .header .header-announcement-bar-wrapper {
    padding-left: 0;
    padding-right: 0;
}
.header-nav {
    width: 100%;
    border-top: 1px solid white;
    padding-top: 15px;
}

 

I'm having issues with this code, its scrambling my navigation items (first screenshot). I would like the items arranged horizontally (second screenshot) with a line above the links. 

Site : www.petalumariverpark.squarespace.com

PW: park

On 9/15/2023 at 2:25 AM, 2birds said:

I'm having issues with this code, its scrambling my navigation items (first screenshot). I would like the items arranged horizontally (second screenshot) with a line above the links. 

Site : www.petalumariverpark.squarespace.com

PW: park

 

 

I see you solved?