How can I add a button on top of a background image on each form?

Anvil Q&A
1

I have made different background images in a design app and am using them as background for the different pages in my anvil app. However, once I have added the image, when I try to add any other component (like buttons) they go below or above the image, not on top of the image.

Is there a way to achieve what I want please?

1 Like
2

Hello,

Please try the XYpanel component as it allows overlap.

2 Likes
3

Oh yes! That did the trick, indeed! Thank you so much!

2 Likes
4

Since I used the XY panels, the interface looks great and it is easier for me to place the UI elements as well. However, just realised that XY panels cannot behave responsively on different sized screens, which is a problem.

I tried the grid but its impossible to place an image as a background for the screen inside the grid. Any other recos please?

1 Like
5

How about a custom role on another container type and then set the background image in CSS?