Image behind Column


I am trying to replicate something like the image below. I have the columns etc but I am trying to work out how to have the image behind the right-hand column and the form sitting on top.

set that group at the back level with an image as the background style

Main Group (row) – has background image
input group (col)

1 Like

Thank you! Will that get messy trying to keep it responsive as I only want it to appear behind the right hand column and so will need to have a wider image as it needs to cover the whole of the row?

Oh I see. This will take some tweaking but you could split the background into 2 images, the light blue could just be the color and the dark blue shape could be an SVG which sits in a group only in the right column. In that right column, you can put the white input group and give it margins, shadows, so it appears floating over the blue shape.

as far as responsive, yes you will need to try it a few ways, and just from this look, it won’t work on mobile since it’s super wide so you may want to try a cut off screen width where you change the design (say 900x wide for example)

This topic was automatically closed after 70 days. New replies are no longer allowed.