0

ウェブページに Google マップを配置し、その後ろにいくつかのテキスト ボックスを配置したいと考えてdivいます。

    <div id="map_area">
      <div id="map_canvas"></div>
    </div>
    <div id="date_range">
      <input type="text" id="start_datepicker" />
      <input type="text" id="end_datepicker" />
    </div>

テキスト入力に自動の高さを持たせ、map_area/map_canvas が残りをすべて占めるようにしたいと考えています。heightmap_canvas に設定する必要があるスタイルは何ですか? これまでのところ、px 単位のパーセンテージまたは高さのみが機能しますが、送信 div が大きすぎるか小さすぎます。

2 番目の div の高さを自動にし、マップの高さを total-minus-second-div にする設定はありますか?

4

2 に答える 2

0

結局、私display: tableはbodyとdisplay: table-rowdiv要素に使用しました。これはかなりうまく機能しましたが、配置したい要素はマップの動的タイルの後ろに配置されていました。

最後に、divGoogleが「カスタムコントロール」で提案しているように、を作成してマップに配置しました。簡単で見栄えがします。

于 2012-07-29T12:29:13.087 に答える
0

html タグと body タグを height:100% に設定する必要があります。

次に、map_area を y height:90% に、date_range を 10%s に設定します。

次に、map_canvas を高さ 100% に設定します。

そのようにして、map_area と date_range は使用可能な画面の高さの 100% を占有し、map_canvas は map_area の高さを完全に占有します。

于 2012-07-29T10:03:55.363 に答える