HELP with background CSS

Hi gliders,

I’m using @Lucas_Pires and @ThinhDinh CSS script to set BG in my app:

<div class="background"></div>
<pre><span><style>
.background {
position: fixed;
margin-top:0;
width: 100%;
height:100%;
top:0;
right:0; 
left: 0%;
z-index:-100;
filter: brightness(100%);
opacity: 15%;
background-image: url("https://storage.googleapis.com/glide-prod.appspot.com/uploads-v2/HpzeX92aFc0MJTlqWmMT/pub/WVN3RKCMM4JmWqpub91z.jpg"); 
background-size: cover;
background-position: center center;
}

</style></span></pre>

the script works perfectly when I add it to a details screen and when you scroll down it’s always visible and stay on the screen:

GIF - BG on Details screen

Here is the problem, when I used the script on SWIPE card the BG is cropped ion the middle of the page and not shown on bottom part.

GIF - BG on SWIPE screen

Anyone have any idea why this is happening and what I can do to fix?

Thanks!

1 Like

Hm, interesting question. Never tried to use it in swipe card :thinking:

Interesting and you have any idea to overcome?