Jump to content

Want boxed navigation boxes to be more expanded instead of being centered and not have the space on the sides.

Recommended Posts

I am currently playing with the css to make the navigation like the mockup after my screenshot but have a hard time actually doing that. I will paste my code below. TIA!

 

 

 

.header-announcement-bar-wrapper {
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.header-display-desktop {
    flex-direction: column;
}
.header-title-nav-wrapper {
    flex: 0 0 100% !important;
    margin-right: auto;
    width: 100% !important;
}
nav.header-nav-list {
    display: flex;
    width: 100%;
    border-top: 1px solid white;
    border-bottom: 1px solid white;
}
.header-nav-item a {
    line-height: initial;
    padding-top: 10px !important;
    padding-bottom: 10px !Important;
}
.header-nav-item {
    border-left: 1px solid white;
    border-right: 1px solid white;
    margin: 0 !important;
    padding-left: 1vw;
    padding-right: 1vw;
    margin-left: -1px !important;
}
nav.header-nav-list {
    justify-content: center !important;
}

Screenshot 2022-11-29 at 10.35.26 AM.png

header (1).png

Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

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.