How to add space or padding between items on the header menu?

Solved
suntisfypopfun
Tourist
6 0 4

Hey friends,

 

I've been struggling when it comes to customizing the main Header menu on my front page. I would like to add space between the menu items so the header menu doesn't look so empty at its ends!

Poured through code for a few hours already but I feel like it's an exercise in futility. Any pointers for a rookie over here? I appreciate your time - Currently using the Out of the Sandbox Turbo theme if that's of any help! 

Thank you for your time.

Nick_Marketing
Shopify Partner
260 48 66

This is an accepted solution.

If you want to add more spacing between the menu items, try adding this code at the very bottom of styles.scss file

.menu.align_right li{
  padding-left: 40px;
  padding-right: 0px;
}

.menu.align_left li{
  padding-right: 40px;
}

 

End result:

2021-07-15 15_19_51.png

 

I hope it answers the question!

- I help businesses with eCommerce and Marketing Technology integrations.
- For consulting work inquiries, please send me a Private Message.
- Presently working in Toronto, CANADA.
suntisfypopfun
Tourist
6 0 4

You sir are a gentleman and a scholar. Thanks a ton - helped me out a ton! Have a wonderful day. 

Nick_Marketing
Shopify Partner
260 48 66

Thank you! Should you will have any questions, feel free to PM me.

- I help businesses with eCommerce and Marketing Technology integrations.
- For consulting work inquiries, please send me a Private Message.
- Presently working in Toronto, CANADA.
0 Likes