Background image problem

You can add some custom css like this to make it stay contained within the page.

body{
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size: contain;
}

Hi John!

Here are my settings:

https://www.groupeadrenaline.com
Background Image: My Jpeg (1088 × 638)
Stretch Background Image: YES
Custom CSS:
body{
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size: contain;
}

1-But the Jpeg is now only centered and not taking up the full screen/page like i want. Is there a way to make it take the whole page?? I can change the background color to be completely black and that can make it appear to be blown full screen since it is a very dark background, but for future purposes, i would like to make a JPEG take full screen.

2- Also, is there a way to make it look responsive? Because on tablet and mobile, we can’t even see the contact details.

Thanks

1. The only way for it to take up the whole page is to use the original settings and have it crop the image.

2. Check out this plugin, it’s the newer version of the coming soon plugin and is responsive. https://www.ads-software.com/plugins/coming-soon/

Thanks for the quick response!!

in response to the first answer, “using the original settings and have it crop”, do you mean it would have to be bigger (higher pixel) and then i would have to crop it to the exact desktop settings??

-Under the new coming soon plugin i checked the box RESPONSIVE. Written right under the box is: “Scale the background image to be as large as possible so that the background area is completely covered by the background image. Some parts of the background image may not be in view within the background positioning area.. Well the last part is exactly the problem i am having, some parts of the background image is NOT in VIEW.

Feeling confused Champ! What can i do?

By the way…if you check the page https://www.groupeadrenaline.com, even under “Responsive”, all info can’t be seen on mobile and tablet.

Then your only option is to use contain css I sent if you want text on the back ground image. Your image will always be cropped unless it’s the exact screen size of the screen. Since every screen size is different you can’t make it exact.