Dawn Theme: White Box Missing Behind Text on Mobile Home Page

Topic summary

A Shopify store owner using the Dawn theme is troubleshooting mobile display issues with their homepage image banner. The white text box background disappeared after implementing a CSS fix to position text over the banner image on mobile devices.

Initial Solution:
ThePrimeWeb provided two CSS options:

  1. Transparent white background
  2. White text with drop shadow (chosen by user)

The code was added to theme.liquid file within <head> tags, restricted to mobile view using media queries.

Subsequent Issues:

  • When migrating modifications to desktop version, user needed to remove mobile-only media query restrictions
  • After upgrading to Dawn v14, banner and text began stacking incorrectly on mobile
  • Additional CSS code with position: absolute !important; was required for the new theme version
  • User requested positioning adjustment to place text at bottom of image, achieved by adding bottom: 0 !important;

Current Status:
The discussion remains ongoing. Most recently, the user reports losing the text overlay again after swapping the banner image, despite validating all previous code changes are still in place. They’re seeking additional troubleshooting guidance.

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

No worries, have a successful launch!