Skip to main content
Best Answer

CSS for Page Background?

  • Apr 18, 2025 6:35 PM UTC
  • 1 reply
  • 239 views

Forum|alt.badge.img+6

I’d like to replace the background color with an image across the site.  I’ve looked through the CSS posts and see a lot about images in widgets, but can’t find anything about page backgrounds.  Has anyone been able to accomplish this?  I’ve tried some basic CSS and it seems like it’s overwritten by the background color settings.

Best answer by elamast

I’d like to replace the background color with an image across the site.  I’ve looked through the CSS posts and see a lot about images in widgets, but can’t find anything about page backgrounds.  Has anyone been able to accomplish this?  I’ve tried some basic CSS and it seems like it’s overwritten by the background color settings.

Hi mzirnhelt,

Try this:

 

main#doc-layout-main {    

background-image: url("https://images.unsplash.com/photo-1743710426934-89887ca897d8?q=80&w=2138&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D");

}
 

You can also add a repeat to the above as needed, i.e….

background-repeat: repeat;

View original

1 reply

elamast
Hero I
Forum|alt.badge.img+7
  • Hero I
  • Answer
  • Apr 21, 2025 1:41 PM UTC

I’d like to replace the background color with an image across the site.  I’ve looked through the CSS posts and see a lot about images in widgets, but can’t find anything about page backgrounds.  Has anyone been able to accomplish this?  I’ve tried some basic CSS and it seems like it’s overwritten by the background color settings.

Hi mzirnhelt,

Try this:

 

main#doc-layout-main {    

background-image: url("https://images.unsplash.com/photo-1743710426934-89887ca897d8?q=80&w=2138&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D");

}
 

You can also add a repeat to the above as needed, i.e….

background-repeat: repeat;