1

私はウェブページを開発しています。左側に検索バーのあるサイドパネルがあり、右側にページの残りの部分を埋めるGoogleマップAPIv3があります。ブラウザを垂直方向に非常に小さくすると、サイドパネルとマップの間、およびブラウザの下部に空白ができます。ただし、テキストはブラウザの下部まで続きます。次のようになります。ここに画像の説明を入力してください

これが私のcssコードです：

<style type="text/css">

    body {margin:0;}
        #panel {height:100%; width:300px; position:absolute; padding:0;background-color:#8C95A0;}
            #header {padding:2px; text-align:center}
            #address_instruction {position:relative; top:7%; padding:2px; text-align:center}
            #geocoder {position:relative; top:8%; padding:2px; text-align:center}
            #toggle_instruction {position:relative; top:22%; padding:2px; text-align:center}
            #layers {position:relative; top:25%; padding:2px; text-align:center}
                #layer0 {padding:2px; text-align:center}
                #layer1 {padding:2px; text-align:center}
                #layer2 {padding:2px; text-align:center}
            #link {top:50%; position:relative; padding:2px; text-align:center}
        #map_canvas {height:100%; left:300px; right:0px; position:absolute; padding:0;}

</style>

#panel内のIDは、パネルの左側にあるアイテムを参照します。サイドパネルの背景色とマップがブラウザの下部まで拡張されないのはなぜですか？

4

1 に答える 1

0

#panel に以下を変更して追加することで問題を解決できました。オーバーフロー:自動; }

于 2012-06-04T16:37:39.410 に答える