I need help centering logo in the header

Technical Q&A
,
1

Hey! I have a problem with the logo not being vertically centered in the header on mobile. Can someone help me?

The “NordicHaven” is not centered on mobile (nordichaven.no):

Hey! I have a problem with the logo not being vertically centered in the header on mobile. Can someone help me?

The “NordicHaven” is not centered (nordichaven.no):

JonathanAaen_0-1725266131870.png
JonathanAaen_0-1725266131870.png463×233 49.3 KB

2

Hello @JonathanAaen

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

@media screen and (max-width: 767px) { .site-header__logo-link { top: 10px !important; } }

niraj_patel_0-1725266819016.png
niraj_patel_0-1725266819016.png319×259 35.7 KB

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

3

Hi,

I would say the fastest way is to theme > customize >open the header and at the botton for the CSS text box add:

@media all and (max-width:767px)
.header-layout–left-center #LogoContainer {

top: 20%; (or whatever percentage you are satisfied with the location)

}

4

Dear Niraj Patel

It worked! I really appreciate you taking the time to save my store!