Copy paste the embed code from google maps (if you do not know how to do this, read here:
https://support.google.com/maps/answer/144361?co=GENIE.Platform%3DDeskt…), with a div wrapper
for example:
Now add some CSS properties inside one of your stylesheet files:
.gmap-responsive{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}
.gmap-responsive iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}
The 56.25% padding value comes from the aspect ratio 16:9. (9/16x100 = 56.25)
original post:
https://www.ostraining.com/blog/coding/responsive-google-maps/?utm_cont…
