Welcome. ![]()
Topic summary
Goal: Reposition banner content (text/button) differently on desktop (left) and mobile (top) in a Shopify theme.
What was done:
- Accessed Online Store > Themes > Edit code, then added CSS in Assets (base.css/style.css/theme.css).
- Desktop: Set banner content padding-left to 0 for the left alignment using the banner content selectors.
- Mobile: Within a max-width: 749px media query, set the banner box to position: absolute; top: 0; with a small padding-top to place it at the top.
Results and follow-ups:
- Mobile positioning worked immediately.
- Desktop shift was subtle at first; after refresh it moved left. User initially asked for “more left,” then decided the current position was sufficient.
- Helper provided optional CSS to push further left (e.g., max-width: 100% and adjustable padding-left like 5rem) for fine‑tuning.
Notes:
- Images were shared to illustrate before/after positions.
- Code snippets and selectors are central to the solution.
Status: Resolved; user satisfied, with optional tweaks available if needed.
1 Like