Wie erstelle ich ein Google Maps-Container-Div mit 100 % Höhe und Breite?

Google Maps-Container-DIV auf 100 % Höhe und Breite einstellen

Viele Entwickler stoßen auf ein Problem, wenn sie versuchen, die Breite und Höhe von a festzulegen Google Maps-Container-Div auf 100 %. Das Festlegen dieser Eigenschaften auf 100 % führt normalerweise dazu, dass die Karte unsichtbar ist.

HTML-Code:

<code class="html"><!-- Maps Container -->
<div id="map_canvas" style="height:100%; width:100px; margin:0 auto;"></div></code>

Lösung:

Um dieses Problem zu beheben, stellen Sie sicher, dass alle übergeordneten Container der Karte auf eine Breite von 100 % eingestellt sind. Legen Sie außerdem eine feste Breite und Höhe für den #content div fest:

CSS:

<code class="css">body, html {
  height: 100%;
  width: 100%;
}

div#content {
  width: 100%;
  height: 100%;
}</code>

Durch Festlegen dieser CSS-Eigenschaften nimmt die Karte nun die gesamte Fläche ein sichtbarer Bereich.

Das obige ist der detaillierte Inhalt vonWie erstelle ich ein Google Maps-Container-Div mit 100 % Höhe und Breite?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!