How can I adjust the padding of main menu items?

Store Design
, , , , , ,
1

Hello, I want to change padding of 2 main menu items and dividing line between them.

THIS IS WHAT I HAVE NOW:

Screenshot 2023-09-15 at 2.29.43 PM.png
Screenshot 2023-09-15 at 2.29.43 PM.png2880×192 5.69 KB

THIS IS WHAT I WANT TO HAVE:

Screenshot 2023-09-15 at 2.03.01 PM.png
Screenshot 2023-09-15 at 2.03.01 PM.png2876×202 7.22 KB

Basically, all I need to be changed is left-right padding, Thank you in advance !

2

Hi @AceStore ,

This is Anthony from Beae Landing Page Builder, and I’m happy to assist you today.

While I acknowledge that this issue falls short of the desired outcome, I have an idea that I believe might be of help:

  1. Go to Online Store → Theme → Edit code
  2. Open your theme.liquid file
  3. Paste below code before :

Note: You can adjust the value to fit your store

Best regards,

Anthony

3

Unfortunately it doesn’t work

4

Hi @AceStore

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Styles.css

#shopify-section-header .navigation--left .navigation__tier-1-container .navigation__tier-1 > .navigation__item > .navigation__link {
    padding-top: 41px !important;
    padding-bottom: 36px !important;
    padding-left: 60px !important;
    padding-right: 60px !important;
}

Hope you find my answer helpful!
Best regards,
Richard | PageFly