Site logo

Archived topic

Is it possible to overlay text across a grid with 2 containers

3 replies · Started by Douglas on March 28, 2022

Viewing posts 1–4 of 4

Hello,
I want to overlay some text across (on top of) 2 containers. Both containers are in a grid together, side by side, each set to 50% , with a horizontal gap of 10px , and both contain images. Any help would be appreciated.

Hi Douglas,

You can do it as such: https://share.getcloudapp.com/9Zum06k6

Specifically, utilize spacing by setting a negative left or right margin to achieve an overlapping effect.

Set the z-index value as well.

Hope this helps! Kindly let us know how it goes. :)

Hi Fernando,
Thank You!
I had to modify your idea a bit as the containers in the grids already had both background images ,and text over the background images.
I added a full width container to the grid, then put the overlay text ,centered ,in that container. After that I set new container's the inner z to 10. Finally, I added -600 top margin, and +500 bottom margin. BINGO!!!!
A million thanks to you, Fernando.

You’re welcome Douglas! Glad you were able to achieve the look you were going for. Feel free to reach out anytime if you’ll need assistance with anything else. :)

This archived topic is closed to new replies.