Background image change width

Topic summary

A user is working on customizing background images for their About Us and Contact pages using Custom CSS code. The background images currently display at full width, but the user needs to adjust them to match a grid layout instead.

Current Setup:

  • Background images added via Custom CSS with background-size: cover and centered positioning
  • About Us and Contact pages display full-width backgrounds
  • Home and product pages use a grid layout where images don’t extend full width

Issue:

  • User wants to change the background image width from full-width to grid-width to maintain consistency across the site
  • Uncertain whether adjustments should be made in the CSS code or elsewhere

Status:

  • Website is now live
  • Support provider requested clarification on what “grid” means in this context
  • Discussion remains open with no resolution yet
Summarized with AI on November 9. AI used: claude-sonnet-4-5-20250929.

I have two pages on my website, About Us & Contact, that have background images for the entire page section. This was added via code added to the Custom CSS:

{
background: url(“https://cdn.shopify.com/s/files/1/0856/1518/2114/files/Liz_Alisha_30_Transparent.png?v=1711048211”)
no-repeat center;
background-size: cover;
}

I need to change the width from full width to grid. Do I make the adjustments here, and if so, what do I change? My website isn’t live yet.

Thanks,

Elizabeth

Hey @ElizabethMI ,

Understand it’s not live, but you can share the preview link to the current store. If it’s password protected, please share the password or remove it temporarily.

Thanks

https://9e8kr3e29woziyza-85615182114.shopifypreview.com

Hi. The website is live now:

www.5lakesflavor.com

Thanks,

Elizabeth

Hey!

I have missed your previous message somehow. Can I know what you mean by grid?

The home page and product page are “grid” where the pictures don’t extend to the full width of the screen. The about us and contact pages are full width. Thanks, Elizabeth