How can I center the main menu using the Empire theme?

Store Design
, , ,

Topic summary

A user seeks CSS code to center the main menu in Shopify’s Empire theme (version 1.8.0), which defaults to left alignment.

Solution provided:

  • Add custom CSS to the end of theme.css file
  • The code targets .site-navigation with justify-content: center

Outcome:

  • The CSS solution successfully centered the menu
  • Issue resolved after implementation
Summarized with AI on November 22. AI used: claude-sonnet-4-5-20250929.
1

Hi, can someone provide me with code so I can center my main menu with the Empire theme? The menu is aligned to the left. Using Version 8.1.0.

Thank you!

2

@homesweethomeau - can you please share your website link?

3

https://homesweethomeau.com/

4

@homesweethomeau - password to view page?

5

yingid

6

@homesweethomeau - please add this css to the very end of your theme.css file and check

.site-navigation {justify-content: center;}

suyash1_0-1678628448228.png
suyash1_0-1678628448228.png1366×768 161 KB

7

It worked, thank you!