Q:

Circular Google Map using css and html

I am trying to make a circular google map but, the map always appears in square.I am using fixed width css circle(http://codeitdown.com/css-circles/)
.circle-text {
width: 500px;
height: 380px;
-moz-border-radius: 50%; 
-webkit-border-radius: 50%; 
border-radius: 50%;
background: #4679BD;
 }

<div id="map-canvas" class="circle-text"></div>

With google Maps.

A:

It is working fine
FIDDLE DEMO
<div id="map-canvas" class="circle-text"><div id="googleMap"></div></div>

CSs
.circle-text, #googleMap {
    width: 500px;
    height: 380px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #4679BD;
}

