Twitter Bootstrap CSS affecting Google Maps

I'm using Twitter Bootstrap, and have a Google map.

Images on the map, such as marker are being skewed by the CSS in Bootstrap.

In the Bootstrap CSS there is:

img {
    border: 0 none;
    height: auto;
    max-width: 100%;
}

When I disable the max-width property using Firebug, the marker image appears as normal. How can I prevent the Bootstrap CSS from affecting the Google maps images?

With Bootstrap 2.0, this seemed to do the trick:

#mapCanvas img {
  max-width: none;
}

There is also an issue with the dropdown selectors for terrain and overlays, adding both these will fix the issues...

#mapCanvas img { 
  max-width: none;
}

#mapCanvas label { 
  width: auto; display:inline; 
} 

The second style will sort of other issues with the terrain and overlay box in some browsers.

Give your map canvas div an id of map_canvas.

This bootstrap commit includes the max-width: none fix for the id map_canvas (but it won't work for mapCanvas).