Jump to content

Left'align vertical stacked navigation

Recommended Posts

Hi, I have created a vertical stacked navigation with the below code. I cannot provide you with a link but have attached a screenshot. The problem is that my navigation links are centered and I cannot get them to left-align. I tried adding text-align: left !important and horizontal-align: left !important etc. but nothing works. Can anyone help with this? Thanks!

This is the code I have used:

// Vertical navigation //


@media only screen and (min-width:991px) {   
  .page-section:first-of-type {     
    padding-top:0px !important;   
  }   
  .page-section {     
    margin-right: 0px; 
  }   
  #header {     
    width: 50px;     
    position: fixed;     
    height: 100vh;     
    z-index: 99999 !important; 
    display: table;     
    writing-mode: horizontal-rl; 
    text-orientation: mixed; 
  }   
  .header .header-announcement-bar-wrapper {     
    padding: 10px 30px 10px 10px;   
  }   
  .header-inner{    
    height: 100vh;     
    display: table-cell;     
    vertical-align: middle !important;
  } 
  
}

.header-nav-item {
 margin-bottom: 5px;
}

// Remove Site title //

.header-title {
  visibility : hidden !important;
 
  }
 

Screenshot 2023-03-02 at 09.00.58.png

Link to comment
  • Replies 3
  • Views 415
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

past this one in custom css box

.header-layout-branding-center-nav-center .header-title-nav-wrapper .header-nav .header-nav-list {
    justify-content: left;
}

 

Hi, I'm BITTU. A website developer with 10 years experience with Squarespace. if you need help and work with me email me here :- mandeepsquarespace@gmail.com

Website:-  dhanjalsolution.com

Best Hourly Rate :- $15 Per Hour

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.