How to center the menu on the Top Bar Predefined Header - Forum | JoomShaper
Staff replied Helix Framework

How to center the menu on the Top Bar Predefined Header

Asked by Matt Hunt 10 months ago Last activity 10 months ago

Top bar predefined header, needing to center the menu. What's the proper css nowadays?

I've tried the following code that apparently worked for someone else.

#sp-menu .justify-content-end {
    justify-content: center!important;
}

1 reply

Paul Frankowski Senior Staff
10 months ago · edited

Hi Matt,

I checked your site, and you're using Header ID name, with Menu ID name. And this should help:

#sp-menu>.sp-column.justify-content-end {
    justify-content: center !important;}

Tip from Helix documenation >> https://www.joomshaper.com/documentation/helix-framework/customization-tips#how-to-change-the-position-of-the-menu

Remember to add it as first line in Custom CSS just in case you may have issues in syntax below.

BTW

If you talk about Header, do not use expression/phrase "top bar" becuase in most cases it's different row(!) in the gird. Is a small detail for you, but for Us important detail.

Log in to reply.