Fixed Background, Scrolling Foreground

• 

  dsuciber · Member · Sep 20, 2017 at 7:07 pm

  • Copy link
  • Add topic to favorites

  Is there any way to have a static background that still scales based on browser/phone sizes, but does not actually scroll, with the foreground content being the only scrolling element?

  The blog I need help with is: (visible only to logged in users)

• 

  piyopiyofox · Staff · Sep 20, 2017 at 7:26 pm

  • Copy link

  Hi dsuciber,

  Let me look into this for you.

  I see that currently you have a repeating background that will continue repeating as pages get longer, and you are hoping to have a background that stays fixed to the page and your content just scrolls while the background is fixed. This is something that can be achieved by editing your theme with CSS. Altering the CSS of your theme requires a Premium plan or above, so please make sure you have the necessary plan to to make these changes.

  Please make sure you are switched the to site you wish you edit and go to https://wordpress.com/customize/. From there you will find a tab called CSS in the left panel. Open that up and paste the code below into the box:

  body.custom-background {
      background-repeat: no-repeat;
      background-attachment: no-scroll;
  }

  This should achieve a fixed background that lets the content scroll on top of it.

  Please let me know if this resolves your issue! :)