Shopify themes, liquid, logos, and UX
Website link: hillenic.com
Hello, I added custom code for dividing line between Mega Main Menu items using code:
li.navigation__item {
border-right: 0.1px solid #FFFFFF;
padding-left: 25px;
}
li.navigation__item.navigation__item--with-children.navigation__item--with-small-menu {
border-right: none;
It makes my Mega menu looks like that:
Questions:
1 ) Does somebody know the code to control the padding of the Dividing Line ?
2 ) Does somebody know the code to make dividing line longer so it touches the bottom and the top of the header ?
Hi @AceStore
This is Henry from PageFly - Landing Page Builder App
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file styles.css
Step 3: Paste the below code at bottom of the file -> Save
.navigation__tier-1-container {
top: 25% !important;
}
.navigation--left .navigation__tier-1-container .navigation__tier-1 > .navigation__item > .navigation__link {
padding-top: 45px !important;
padding-bottom: 30px !important;
}
Hope that my solution works for you.
Best regards,
Henry | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
Unfortunately it doesn't work. Do I have to delete my previous code and add yours or I just have to add it below the one I have ?
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025