Hi. I am having issues with my mobile view header. I need to reposition my store’s name/logo in mobile view without changing my desktop view. I have tried adding to theme.css without success.
Topic summary
A user is experiencing difficulty repositioning their store’s name/logo in mobile view while keeping the desktop layout unchanged. Previous attempts to modify theme.css have been unsuccessful.
Proposed Solution:
- Access Shopify admin → Online Store → Themes → Edit code
- Locate the CSS file (base.css, theme.css, style.css, or assets/theme.css.liquid)
- Add a mobile-specific media query targeting screens max-width 749px
- Apply centering styles to header/logo classes using flexbox and auto margins
- Optional vertical positioning adjustment available via margin-top
Status: The discussion remains open, awaiting feedback on whether the suggested CSS code snippet resolves the mobile header positioning issue.
Hey @Trish68,
Could you please share your store URL and password (if applicable) so that I can take a look and provide you the solution code?
Looking forward to hearing back from you.
Best,
Liam Scott
Hi. Sorry, I forgot to mention that I’m working on another theme at the moment and not my live theme. It’s the Balance theme I’m having issue with, if that makes sense.
It’s probably better to paste the code in the section’s custom css rather than in the base.css or theme.css file, as theme updates don’t always carry over if written into the main files.
Yup!
Still you can able to share the share the preview link. Or you can share the collab code so that I can fix it for you.
here is the link MenzPlace · Customize Balance · Shopify Collab code is 2098
I found that you shared the admin link. Please share your store url instead.
You can deduce preview link from the admin link shared. Here is the proper preview link:
https://621eix-ej.myshopify.com/?theme_preview_id=148771438759
Now we need to know how you want to reposition your elements…
And, ideally, restore the default code.