martujv
December 27, 2023, 11:50am
1
Hello! I am using the stiletto theme and I want to center the main menu while keeping the logo on the left and the icons on the right. I would like to center the menu both in mobile and desktop versions.
My store url would be: www.winnerofficial.com
Thank you!
Hi @martujv
try to add this code1. Go to Online Store->Theme->Edit code
2. Asset->theme.css-> paste bellow code in bottom of file
.header__inner [data-scroll-container], .header__inner [data-scroll-container][data-axis=horizontal] { width: 100%; }
.header__row-segment.header__row-segment-desktop.left.contains-nav { flex-grow: 1; } div[data-scroll-container-viewport] { justify-content: center; }
1 Like
Hello @martujv
You can add code by following these steps
Go to Online Store → Theme → Edit code.
Open your theme.liquid file
Paste the below code before on theme.liquid
.header__inner .header__row {
position: relative;
}
.header__inner .header__links-primary-scroll-container {
position: absolute;
left: 41%;
}
@media screen and (max-width:991px)
.header__inner button.header__menu-icon {
position: absolute;
right: 47%;
}
}
Mobile:
Desktop:
1 Like