Rumah > hujung hadapan web > tutorial css > Bagaimana untuk Membuat Div Bekas Peta Google 100% Tinggi dan Lebar?

Bagaimana untuk Membuat Div Bekas Peta Google 100% Tinggi dan Lebar?

DDD
Lepaskan: 2024-10-26 00:13:28
asal
957 orang telah melayarinya

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

Tetapkan Google Maps Container DIV kepada 100% Tinggi dan Lebar

Ramai pembangun menghadapi masalah apabila cuba menetapkan lebar dan ketinggian sesuatu Div kontena Peta Google kepada 100%. Menetapkan sifat ini kepada 100% biasanya menyebabkan peta tidak kelihatan.

Kod HTML:

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

Penyelesaian:

Untuk menyelesaikan isu ini, pastikan semua bekas induk peta ditetapkan pada lebar 100%. Selain itu, tetapkan lebar dan ketinggian tetap untuk div #content:

CSS:

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

div#content {
  width: 100%;
  height: 100%;
}</code>
Salin selepas log masuk

Dengan menetapkan sifat CSS ini, peta kini akan menduduki keseluruhan kawasan yang boleh dilihat.

Atas ialah kandungan terperinci Bagaimana untuk Membuat Div Bekas Peta Google 100% Tinggi dan Lebar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan