Can’t figure this one out. I have dark theme set on my app so the background is set to black. I am now trying to add an image to the background on certain pages and It is getting set behind the black color. Any clue how to fix this?
I played with Z-index , but no luck. Not sure how to resolve and my searches have come up empty.
here is my class that I am adding to the ion-content
.bg{
position: absolute;
width:100%;
height:100%;
background-image: url('url image here') ;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-color: transparent;
}
Try targetting .scroll-content instead (no need to add that class to anything, it is automatically generated inside of ion-content).
Edit: Also, don’t change the position / width / height of .scroll-content
2 Likes
That did the trick. now to make the rest of the page look right… Thanks!!
Hey Josh I watch a lot of our youtube videos and love them. Keep up the awesome work. Can I ask another question. Maybe I am taking the wrong approach and maybe you can lead me down the proper way to do this. Here is what I am trying to get to: Let’s say my page is caller CamperMode:
On camper mode page I will have some buttons and I want to position 2 pictures (1 local and 1 from a url) overlaid on another and positioned and sized to my liking. while all this will sit on top of the black background set by the theme.
Hope that makes sense.