Make page text box width wider on Dawn for mobile

Store Design
,

Topic summary

A user needed to adjust page text box width on the Dawn theme, specifically for mobile devices. They had existing CSS code that widened desktop text boxes but caused mobile width to become too narrow.

Solution provided:

  • Add custom CSS to theme.liquid file before the </head> tag
  • Target mobile and tablet breakpoints separately using media queries
  • Adjust .page-width class for different screen sizes

Implementation steps:

  1. Navigate to Online Store → Theme → Edit code
  2. Open theme.liquid file
  3. Insert the provided CSS code snippet

Outcome: The solution successfully resolved the mobile width issue while maintaining proper text box sizing across all devices.

Summarized with AI on October 27. AI used: claude-sonnet-4-5-20250929.
1

Hello all! I can’t find the thread anymore, but the only code that worked for me to make the page width text wider was below. However, this makes the mobile width very small. Can someone please help me with additional theme.liquid code to make the mobile width and separately the tablet width wider than that? Thanks!
2

Hi @ryanb819z ,

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

Thanks!

3

That worked perfectly - thanks so much!