Stack a group over another


I am trying to create a small image gallery that should appear in the results of a search.
It is quite popular in websites as airbnb or real estate classified, where, after the search, all results are shown and, every result has its own thumbnails gallery to see a preview of the images.
I would like to have 2 arrows (or similary some dots) on top of the thumbnail image to navigate through the gallery. I would like also the website to be responsive, so I have no fixed element in it. Now, to do that, my idea was that to have a group with a column layout and, inside it, to stack a repeating group to store the thumbnail images and another group to keep the 2 arrows icons. Doing this way, I can set a negative top margin for the group with the 2 arrow icons that finally will appear on top of the thumbnail image. Anyway I can set the top margin exclusively in pixels and, when the page sizes change, the 2 arrows group changes its position relative to the thumbnail (as it has a fixed negative top margin). Can anybody maybe suggest a workaround for this? Thank you very much!

You’re better off using ‘Align To Parent’ as a layout type for this kind of thing…

You can put your existing group into another parent group (align to parent) then you can add you arrows into that group ‘on top of’ the other group…

Ah ah!..Super!!! I didn’t think this kind of alignment allowed that…Thank you very much!!!

1 Like