~~~ Please read before posting. ~~~

Important: We need your Club Number at a minimum, and as many details as possible.
For further info please read This page before posting.

Wrapper Element for Google Maps iFrame

  • Lcala305
  • Lcala305's Avatar Topic Author
  • Offline
  • FreeToastHost Ambassador
  • FreeToastHost Ambassador
  • Posts: 52
  • Thanks: 2

Wrapper Element for Google Maps iFrame

4 years 9 months ago
#82172
Club #1695

I need assistance on how to effectively wrap my google maps iframe so that it appears in full view via a mobile device. I read the thread addressing wrapper elements, which has worked for videos and images; however, if I use the same method for a google maps iframe, the rest of the page gets completely thrown out of wack.
The topic has been locked.
  • Brian
  • Brian's Avatar
  • Offline
  • Administrator
  • Administrator
  • Posts: 10617
  • Thanks: 3569

Re: Wrapper Element for Google Maps iFrame

4 years 8 months ago
#82173
Rather than reinventing the wheel, just get the link from google maps and put the link on the page for mobile users to click.

Your other choice is to experiment with inline css, lots of examples in google.
Code:
.map-responsive{ overflow:hidden; padding-bottom:56.25%; position:relative; height:0; } .map-responsive iframe{ left:0; top:0; height:100%; width:100%; position:absolute; } <div class="map-responsive"> <iframe YOUR OWN Google map code ></iframe> </div>
The topic has been locked.
Moderators: Brian, Jane Atkinson, Pam, rhtaylor3, marc33, NotLiable, jgavin, Lcala305, peterb323
Time to create page: 0.156 seconds

Copyright © 2025 FreeToastHost 3 Support. All Rights Reserved.