In Webkit-Browsern berücksichtigen Google Maps der Version 3 nicht den Rahmenradius des Containers. Hat jemand eine Problemumgehung?
Ich habe zwei Google Maps. Die erste wird mit der Google Maps-API (v3) erstellt und ist in # map1 enthalten. Die zweite wird in einem Iframe mit der von Google vorgeschlagenen Einbettungssyntax angezeigt und ist in # map2 enthalten.
Hier ist die Geige:http://jsfiddle.net/wmcmeans/mPGWx/7/
Hier sind die Schnipsel:
<div id="map1" class="gmap left bling"></div>
<iframe id="map2" class="gmap right bling" height="425" width="550" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?hl=en&q=augsburg+germany&ie=UTF8&hq=&hnear=Augsburg,+Bavarian+Swabia,+Bavaria,+Germany&t=h&ll=48.451123,10.862346&spn=0.004981,0.00912&z=16&output=embed"></iframe>
Hier ist das Problem: Google Maps, das mit der v3-API erstellt wurde, berücksichtigt bei der Anzeige in einem Webkit-basierten Browser nicht die Ränder des Containers, für den der Rahmenradius festgelegt wurde. Die Methode iframed (embed) weist nicht denselben Mangel auf.
Gut getestet:
FireFox v 19.0.2 (Windows 7)
FireFox v 32.0.3 (Windows 8.1)
IE9 v 9.0.8112 (Windows 7)
IE11 (Windows 8.1)
Fehlgeschlagen am:
Chrome v 25.0.1364.160 m / Safari (Win / 32) v 5.0.3 / Opera v 11.64 (Windows 7)
Chrome v 38.0.2125.104 m (Windows 8.1)
Karten der Version 2 sind veraltet und keine Option. Ich möchte v3-Maps nur mit CSS formatieren, ohne Grafiken oder Überlagerungen. Ich suche nach einer Problemumgehung für das Webkit-Rendering-Problem. (Ich habe schon eine geöffnetChromium Issue # 187187 dafür muss das fast ein jahr später noch angeschaut werden).