Skip to content

Instantly share code, notes, and snippets.

@tkjaergaard

tkjaergaard/google-maps-round.html

Created February 17, 2012 12:38
Show Gist options
  • Save tkjaergaard/1853190 to your computer and use it in GitHub Desktop.
Save tkjaergaard/1853190 to your computer and use it in GitHub Desktop.
Download ZIP
Round Google Maps
Raw
google-maps-round.html
<style>
#mask {
overflow: hidden;
border-radius: 50%;
position: relative;
z-index: 99;
height: 500px;
width: 500px;
border: 10px solid #000;
}
#mask iframe {
position: absolute;
border-radius: 50%;
top: 0; left: 0;
z-index: 50;
}
</style>
<div id="mask">
<iframe width="500" height="500" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.dk/?ie=UTF8&amp;t=m&amp;ll=55.677875,11.075935&amp;spn=0.048395,0.086002&amp;z=13&amp;output=embed"></iframe>
</div>
@emdadcse
Copy link

This code ok for chrome & Firefox but problem with Safari ( I could not test with old version or IE ). Thanks for share it.

@steinig
Copy link

steinig commented Apr 15, 2017

I like this piece of code.

@AkashA4
Copy link

AkashA4 commented Oct 11, 2017

Thanks.. its very helpful for me..

@ezlomar62
Copy link

Genius!! I like

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment