How to vertically align logo with header menu in dawn?

Topic summary

A user encountered a vertical alignment issue between their logo and header menu in the Dawn theme, specifically on the homepage. The logo appeared positioned higher than the menu items, while other pages displayed correctly.

Potential cause:

  • The user had customized the header by using a Google font instead of Shopify’s preloaded fonts
  • CSS adjustments were made to accommodate different font variations (H1, H2, etc.), which may have affected the alignment

Solution provided:
Add custom CSS code to the theme.liquid file, placed before the closing </body> tag, wrapped in a conditional statement targeting only the index/homepage template.

Outcome:
The suggested CSS fix successfully resolved the alignment issue.

Summarized with AI on November 15. AI used: claude-sonnet-4-5-20250929.

Hello,

I’ve looked everywhere for a solution but no changes to the CSS have been able to affect my logo position so far and it’s driving me nuts. Does anyone have any advice on how to center my logo vertically with my header menu? Right now its much higher than the menu and needs to move down.

This only seems to be an issue on my homepage (1st screenshot). All other pages show my header menu in alignment with the logo.

I did use a Google font instead of Shopify’s preloaded fonts and made some adjustments to the CSS to accommodate different font variations (ex. H1, H2), so I’m thinking that may have affected it.

https://whereverable.com/

Homepage:

Secondary Page:

Thank you in advanced!

Hi @wherever2020 , go to theme.liquid, and add this code at the end before the tag :

{% if template == 'index' %}

{% endif %}
1 Like

Thank you @Abdosamer , that worked!!

1 Like

Glad I helped, feel free to contact me if you need help with your store.