Re: Issues with site header

Solved

How can I fix alignment and gap issues in my site header?

Ivnvu
Excursionist
21 0 3

Hello,

 

 

I'm having issues with my site header after adding padding to the top and bottom header. Firstly, the header elements don't line up perfectly with the site body (as seen in picture one) and secondly, there is a gap between the bottom header and its drop down menus which I would like to close (as seen in picture two). I thought maybe someone has an idea about how to solve it 🙂

 

I appreciate any help, thanks in advance!

 

My store: gryningens (Local Theme) 

 

Untitled.png

Untitled2.png

  

Accepted Solution (1)

GemPages
Shopify Partner
5624 1261 1230

This is an accepted solution.

Hello @Ivnvu 

 

It's GemPages support team and glad to support you today. You can follow these steps:

1. Go to Online Store -> Theme -> Edit code
2. Open your theme.liquid theme file
3. Paste below code before </body> :

 

<style>
     @media screen and (max-width: 1920px){
         .site-nav.style--classic nav>ul {
              margin-inline-start: -1.25rem;
              -webkit-margin-start: -1.25rem;
         }
     }
     .header-container .header-actions>.button[aria-controls="site-cart-sidebar"]{
         margin-right: 0;
     }
     .site-nav.style--classic .submenu{
         margin-top: -13px;
     }
</style>

 

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

View solution in original post

Replies 3 (3)

GemPages
Shopify Partner
5624 1261 1230

This is an accepted solution.

Hello @Ivnvu 

 

It's GemPages support team and glad to support you today. You can follow these steps:

1. Go to Online Store -> Theme -> Edit code
2. Open your theme.liquid theme file
3. Paste below code before </body> :

 

<style>
     @media screen and (max-width: 1920px){
         .site-nav.style--classic nav>ul {
              margin-inline-start: -1.25rem;
              -webkit-margin-start: -1.25rem;
         }
     }
     .header-container .header-actions>.button[aria-controls="site-cart-sidebar"]{
         margin-right: 0;
     }
     .site-nav.style--classic .submenu{
         margin-top: -13px;
     }
</style>

 

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
Ivnvu
Excursionist
21 0 3

Many thanks!

GemPages
Shopify Partner
5624 1261 1230

I am glad that my recommendation is helpful to you 😁.

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center