Why does CSS style distort Google map scaling?

Question

Here is the working version

Here is the incorrect version (the zoom widget no longer displays properly) with Bootstrap style

Why is this interrupted?

+5

Hoa May 02, '12 at 4:34

4 answers

You can also fix this for individual cards, for example:

.googleMapContainer img {
    max-width: none !important;
}

+11

wtds Mar 27 '13 at 13:03

, .

.gm-style img {
    max-width: none;
}

0

dibs 30 . '14 22:22

,

.angular-google-map img {
    max-width: none !important;
}

0

Dasun 10 . '15 18:50

luke2012 · Accepted Answer · 2012-05-02T04:53:07+0000

There is a problem in the Bootstrap.css 69 line max-width: 100%;.

img {
max-width: 100%; <--
vertical-align: middle;
border: 0;
-ms-interpolation-mode: bicubic;
}

You can delete it and, if necessary, specify a new class again .newclass {max-width:100%}and add it to the image.