Bootstrap img-circle for embedded Google map in Safari not working -
currently using bootstrap build wordpress theme. now, i've embedded google map via jquery loads within specified div:
<div id="map" class="img-responsive img-circle"></div>
i've applied img-responsive , img-circle said div map appears circle , responsive when scaled down across devices. map beautiful , works fine , dandy in chrome , firefox not in safari (8.0.8).
this code verified on safari,chrome,mozila etc.
<!doctype html> <html> <head> <meta charset="utf-8"> <title>untitled document</title> <style type="text/css"> iframe{ -moz-border-radius:250px; -webkit-border-radius:250px; -o-border-radius:250px; -ms-border-radius:250px; border-radius:250px; } </style> </head> <body> <div class="map-image"> <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3635689.793072721!2d80.8833819!3d27.141237!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x30635ff06b92b791%3a0xd78c4fa1854213a6!2sindia!5e0!3m2!1sen!2sin!4v1441046961837" width="500" height="500" frameborder="0" style="border:0" allowfullscreen></iframe> </div> </body> </html>
Comments
Post a Comment