Only dependency is you know the aspect ratio (width x height) of the iframe. Then wrap the code in a div and give it the class "goomap" (don't forget the closing ). it to make any iframe, YouTube & Vimeo video or Google Map responsive. Meaning your beautifully designed contact page looks on mobile view because the width of the map is always forced at 600px.Įven changing the width value in the embed code from px to % doesn't seem to do anything.īut with a bit of sneaky CSS you can easily fix the issue.įirst of all paste your original embed code into the HD-An圜ode module. You should also delete the fix height & width that Google.
When I resize my browser windows width I would like the map to stay. w-100 to the iframe element in order to make sure that your Google Map embeds are fully responsive. It's easy to embed a Google Map using the HD-Anycode module but as an iframe based service Google Map embeds are not responsive. I have a Google Maps (V3) in my page at 100 page width with one marker in the middle.