How to Center the Desktop menu on Desktop?

Store Design
, , ,
1

Hi. My store my main theme is the default debut theme.

I’m trying to align the desktop menu to the center and make the font a bit bigger.
There are no such options in the theme customization options.

Every guide I find talk about editing theme.scss or style.css files, which I don’t have in my theme.

What should I do ? Thanks

2

Hello @thehoodoo

To provide you with the most precise solution in this case, could you please share your store url, page URL ( with pass if your store password is enabled )?

Thank you and hope to hear from you.
Best regards,
GemPages Support Team

3

Yo guys I’m actually your customer lol.
www.aloi-candele.com

4

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Add this CSS at the bottom

Online Store ->Theme ->Edit code

Assets ->base.css

@media screen and (min-width: 990px) {
.header--middle-left {
    grid-template-columns: 1fr 1fr 1fr;
}
.list-menu__item {
    font-size: 22px !important;
}
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

5

Nope, it does make the menu go on different lines:
There isn’t any code that is like : Header center middle and that’s it ?

6

Please add below css code in bottom of assets/base.css file

header.header.header–middle-left {
display: flex;
justify-content: space-between;

}

a.header__menu-item {
font-size: 1.6rem;

}
Thank you.

2 Likes
7

This worked as I expected. Thank you. Font size can be changed to make it bigger, i set it at 1.9. Cheers

1 Like