2012-02-02 11 views
3

私は、ユーザーがさまざまなことをやり遂げることを可能にするJavaScriptプログラムにメニューを追加しようとしています。私はHTMLの達人ではないので、ページの上部と右側にメニューを保持する方法はわかりません。私はdivを使用してみましたが、それはそれの代わりにマップの下に置くだけです。ブラウザに表示される画面のスクリーンショットは次のとおりです。 enter image description hereGoogleマップの右側にあるHTMLコンテンツ

右の空白はメニューを配置したい場所です。誰も私がそこにテーブルを置く方法の例を提供することはできますか?ここでは、私のHTMLの体は今ある方法は次のとおりです。

<body onload="initMap()"> 
    <div id="map_canvas" style="width:85%; height:100%"></div> 
    </body> 

答えて

4

2つのDIVを並べて(タッチして)取得するには、通常、両方をfloat:leftに設定します。このような何か:あなたはfloatを指定した場合

<body onload="initMap()"> 
    <div id="map_canvas" style="float:left; width:85%; height:100%"></div> 
    <div id="map_side" style="float:left; width:15%; height:100%"></div> 
    </body> 

:右第二のdivの上に、それがブラウザウィンドウの右側にはなく、その隣のdivに「固執」します。

+0

それは機能しました!ありがとう! – mkyong

1
<body onload="initMap()"> 
    <div id="wrapper"> <!-- not strictly necessary, but good practice IMHO --> 
     <div id="map_canvas" style="float:left; width:80%; height:100%"> 
     </div> 
     <div id="your-new-div" style="float:right; width:15%;"> 
     </div> 
    </div> 
</body> 

divがテーブルよりも、ここでよりよい解決策だろう...上記を試してみて、私はあなたが作る方法を知ってみましょう。

float:rightはメニューを画面の右側に貼り付けます。私はいつも私の合計幅を100%よりわずかに小さく設定しました - この方法では、必然的にパディング/マージンを追加すると、ちょっとした揺れの部屋があります。

関連する問題