Mobile header margin problem in Dawn theme

Topic summary

A user encountered a logo alignment issue in the Dawn theme’s mobile header. The logo wasn’t flush left like the cart icon was flush right, despite being left-aligned in settings.

Solution provided:

  • Add CSS code to the end of base.css file (Shopify Admin → Online Store → Theme → Edit code)
  • Target the header with left/right padding adjustments using a media query for mobile screens (max-width: 749px)
  • Initial CSS didn’t work until !important flags were added to override existing styles

Outcome:
The issue was resolved after applying the modified CSS with !important declarations. The problem only affected mobile view; desktop display was correct.

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

Thanks! worked :slightly_smiling_face: