I have made a layout from a grid (cause I like my images to have different proportions) Now I like to put a text with a link op top of each images, but I cant figure out how? Cause when I drag a div-block on to the grid it pushes the image instead of going on top.
And if I should use another method than grids, also please let me know.
to achieve what you want, you need to expand the structure of your grid a bit.
instead of placing the images directly in the grid, use divs (e.g. with the class grid_image-wrap) and place the images in these divs. Important, the div should be set to position: relative;.
add another div to each grid_image-wrap and name it for example grid_image-content. Set this to position: absolute; with 0% top 0% right 0% bottom 0% left.
in the grid_image-content you can add anything you want, like an image title and link.
Hi Dennis, Thank you very much for your help thats exactly what I was looking for I think.
However I cant get it look like yours. When I put in a div set to absolut the image jumps out of the grid and place itself in the upper left corner of the page… hmmm. Could you try to send me a screendump where you have the div “grid_image-wrap” chosen, so I can see your settings in the right?
Thanks
Kim
The reason this happened to you because you didn’t set the grid_image-wrap to position: relative;. You will probably need this very often, so I recommend the following, really well explained video from Webflow:
Thats great thank you very much. And also great with the video and yes your are right its about understanding the different position possibillities which can be hard.
