OSM responsiv

[evaki]

Hatte eine Möglichkeit gesucht in das Template "daflekk" (von fischstäbchenbrenner) über den Editor einen OSM-Ausschnitt einzufügen. Sollte natürlich responsiv funktionieren. Diverse Scrpts/Frameworks stehen dafür zur Verfügung. Nachdem der Level "es reicht" erreicht war (das übliche Zeitproblem), gab es den Rettenungsanker.

Also karten-generator . com/osmkarten.html genutzt. Den generierten Code

...<div id="map" style="width:500px;height:400px;"></div><script type="text/javascript">var map;
auf  <div id="map" style="width:100%;height:400px;"></div><script type="text/javascript">var map;
geändert.

Anscheinend war es das schon. Hat jemand damit schon Erfahrungen gemacht oder andere einfache Lösungen parat?

MfG. Evaki

Editor: Der Code wurde in div oder html5-Tag eingepackt.

[fischstäbchenbrenner]

Praktisch alle diese Dinge - egal ob (Google)Maps oder YouTube erzeugen einen iFrame.
Manchmal direkt im Code-Schnippel, oder eben per JS erzeugt.

Grundsätzlich reicht es, width auf 100% zu ändern, um das ganze responsive zu machen.

Die Frage ist immer die höhe (height). Oft kann man den Wert einfach lassen wie er angegeben ist, manchmal geht auch height:auto; (Das muss man testen)

Sehr oft geht diese möglichkeit:
http://websitebaker.at/wb-templates/topics/videos-responsiv-einbinden.html
Auch bei anderem als Videos, man muss nur mit den padding-werten experimentieren.