Maison > interface Web > tutoriel CSS > Comment créer une division de conteneur Google Maps à 100 % de hauteur et de largeur ?

Comment créer une division de conteneur Google Maps à 100 % de hauteur et de largeur ?

DDD
Libérer: 2024-10-26 00:13:28
original
842 Les gens l'ont consulté

How to Make a Google Maps Container Div 100% Height and Width?

Définir le DIV du conteneur Google Maps sur 100 % de hauteur et de largeur

De nombreux développeurs rencontrent un problème lorsqu'ils tentent de définir la largeur et la hauteur d'un Conteneur Google Maps div à 100 %. La définition de ces propriétés à 100 % rend généralement la carte invisible.

Code HTML :

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

Solution :

Pour résoudre ce problème, assurez-vous que tous les conteneurs parents de la carte sont définis sur une largeur de 100 %. De plus, définissez une largeur et une hauteur fixes pour le div #content :

CSS :

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

div#content {
  width: 100%;
  height: 100%;
}</code>
Copier après la connexion

En définissant ces propriétés CSS, la carte occupera désormais la totalité de la zone visible.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal