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).

it looks this: enter image description here

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

Popular posts from this blog

c# - Binding a comma separated list to a List<int> in asp.net web api -

Delphi 7 and decode UTF-8 base64 -

html - Is there any way to exclude a single element from the style? (Bootstrap) -