fritzness on "Zerif Lite Background image not responsive"

Hey guys I just built my website: fritzness.de

I'm using the awesome Zerif Lite Theme, but I'm running in some problems conceing the responsiveness of the background image.

It doesnt display the whole background image when I'm using different devices to access the website.

For example on a 13 inch laptop it looks good but on bigger or smaller screens (smartphone or large screens) it doesnt show the whole picture like I intended.

I know the question got already asked, but the older threads seemed outdated.

Would love if I could get some feedback on the issue! Zerif Lite is an awesome Theme!

Hi there,

Try adding following custom CSS to Zerif and see if it does the trick.

@media (max-width: 702px){
body.custom-background {
background-size: 100%;
}

If it doesn't, try this instead

body.custom-background { background-size: cover !important;
}

You can use Advanced CSS Editor to add above CSS. Hope it helps.

Hi man,

should I add it to "global CSS" in the advanced CSS editor?

and what can I do when it does strange things to reverse it?

Thanks a lot man appreciate your help!!

Hey there,

You should be adding it to global CSS. If you want to revert the changes, just delete the code from Global CSS in Advanced CSS Editor. Let us know if you have any other questions. Thanks :)

The second one worked really good!

Lots of love man keep it up! <3

Hey there,

Glad it worked. If you're happy with our products and support, please leave us a kind review here. Also, don't forget to mark this topic as resolved. Cheers :)