How to overlap Sections/Containers/Divs

[ryanj29 (Ryan)]

Hello,

We’re looking to overlap a section over other sections, similar to the map shown in our Figma file:

How would you go about doing this? We’re not sure if the map should be a section or div, specifically. Thanks!

FYI - the map element only loads in the published site (if you’re trying to view the read-only link).

---

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

[mww (Milan)]

Hi @ryanj29,

I’d recommend using position: absolute on the map (you can use a div or HTML embed element) - while setting the parent section to position: relative.

Here’s a quick screen recording to demonstrate how you could go about this: Screen Recording 2022-05-21...

Hope this helps!

[vicrost (AbdulRahman Tijani)]

I am currently rebuilding this the homepage for this site as practice and would like to overlap the three cards on the hero section as shown here:

When I tried to do this using the method you advised however, I am getting this:

Essentially, I have two problems:

1. The card’s white background colour is not overlapping the bg colour of the hero section
2. The space between the cards and the content above it on the designer is different to that seen on the site preview. This is what it looks like on the site preview for comparison
   
   

Here is my site read-only: Link

Thank you

[Ben_B]

Huge thank you, MWW. You saved my life!!
I spent a few hours to find something to help me to continue my project until I’ve found your solution.
I’m not sure if I missed something from the University.