Heading and Text over map integration

Hey :wave:

I’m trying to place a text/heading element over a responsive map but cannot figure out how to do this.

Here’s a screenshot of what I’m trying to achieve. https://snag.gy/ZezKcx.jpg

Does anyone know how to do this or have any tips?


Here is my site Read-Only: https://preview.webflow.com/preview/jdc-05d8fd?utm_source=jdc-05d8fd&preview=f9f881f27163ee93f51fb9c7ceda2bbc&mode=preview
(how to share your site Read-Only link)

Hi @Ops_JDC, welcome to the forum :slight_smile:

The map element is a bit tricky, since it has some properties that can not be overridden.
What you can do, is place the map widget inside a wrapping div, and give that div an absolute positioning, width and height. Now you can place a text element on top of the map wrapper.
https://www.loom.com/share/5dafbd02b6414ead8d70c56919d46971

THANK YOU :pray:That worked perfectly

1 Like

I have another small change I’m trying to make that I can’t quite figure out, if you’d like to take a stab at that too?

I’m trying to put a divider line between the two columns in the screenshot above.

https://preview.webflow.com/preview/jdc-05d8fd?utm_source=jdc-05d8fd&preview=f9f881f27163ee93f51fb9c7ceda2bbc&mode=preview

Give one of these columns a class name and a property of left border