Page 1 of 1

Google Maps rounded corners

Posted: Fri Apr 30, 2010 9:33 am
by amh1010
I have boxes with rounded, transparent corners on my site. Right now I have en embedded map sitting inside one of these rounded boxes, but I want to map to be its own box. I can't simply put an image over the corners of the map since I need the corners to be transparent to accommodate the gradient background. Any ideas?

Re: Google Maps rounded corners

Posted: Fri Apr 30, 2010 1:57 pm
by Christopher
Either float a div with the corners over a div with the map, or make the map the background image.

Re: Google Maps rounded corners

Posted: Fri Apr 30, 2010 3:58 pm
by geoffmuskett
might be able to use CSS3 rounded corners if you don't mind that older browsers won't support it...

Code: Select all

#div {
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
}

Re: Google Maps rounded corners

Posted: Sun May 02, 2010 1:43 pm
by amh1010
I'm not sure how making the map the background image would help. I'd still have to layer it over the gradient background, leaving me with the same issue.

Is it possible to round the map's corners in Javascript?