Background Image - Cover

Hello!

I am trying to use a background image that I want displayed full-sized regardless of content in the container. I have added the background image in the section wrapper, selected 'center, center - no repeat' and then 'cover' for the background size. However, when I add a content wrapper into that section, the background only displays a tiny row that falls behind the content.

Is there a way to force the entire background image to show regardless of the content that's in the container?

Thanks in advance.

Comments

  • Hi,
    Please always attach a link so we can check it out. If the page is offline(localhost) then our help will be limited, you will have to contact us when the page is online. Also please make sure that the page is not under maintenance before you provide us the link.
    thanks
  • Hi Pablo,

    Sorry about that. Hopefully this link shows the issue I am having:


    Thanks
    JC
  • edited September 2020
    You cannot attach a background image into the whole #Content at all, but you can insert it into the <html> tag and it will be look like it's behind the content.
    Just please upload an image in the field dedicated to it and turn on the Transparent option for Content.
    Theme Options > Global > General

    Thanks

  • Thanks for the quick reply - 

    Will that BG image then show in all my content boxes? I just want it in one particular content box - because I want to put another text image over top of it. And use a different BG with different text images elsewhere.

    The alternative is that I can cheat with padding to display the entire image, but that messes up responsiveness.


  • Well, it will be displayed on whole website, there is no option to change it on only one, particular page using the muffin options.
    You can only insert the background for section in this case :(

    Of course, you can use the Custom CSS code for the #Content container, just insert your code in the field on the bottom, while editing the page.
    Thanks
  • Awesome. Thanks for your help.
Sign In or Register to comment.