全角GoogleマップとCSS

height="100%"とwidth="100%"を使用しているページに全角googleマップがあります。私はその上にのいくつかのCSSのdivのものを入れて知りたいです。私はmargin-top: -500px;のような負の値を使用して読み込みますが、divの背景に色を割り当てようとするとマップ上に表示されず、その下に表示されます。私はまったく欲しいものです。これには解決策がありますか？コード：全角GoogleマップとCSS

<iframe width="100%" height="100%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?hl=en&ie=UTF8&ll=37.0625,-95.677068&spn=56.506174,79.013672&t=m&z=4&output=embed"></iframe> <div class="content"> I want this text to be in a div box that has a black background. <br /> </div>

スタイル：

.content { margin-top: -500px; width: 390px; background-color: black; }

出典

2012-04-20 Joshua Terrill

下の地図上に表示されるようにあなたは絶対位置と正のzインデックスを与えられるべきであるスタイルにしたいdiv要素が修正[Googleマップコンテナを設定されているクロムで動作しますDIVの幅と高さ100％]（http://stackoverflow.com/a/18147172/782535） –

html, body { 
    width: 100%; 
    height: 100%; 
} 

.map-frame { 
    width: 100%; 
    height: 100%; 
    position: relative; 
} 

.map-content { 
    z-index: 10; 
    position: absolute; 
    top: 50px; 
    left: 50px; 
    width: 390px; 
    background-color: black; 
    color: #FFF; 
}

http://jsfiddle.net/oswaldoacauan/tx67C/

出典

2012-04-20 17:48:51

しかし、負のマージンは意味的に正しいですが、私は絶対的な位置決めを代わりに使用することをお勧めします。 –

は、あなたのCSSにこれを追加します。少なくとも

position:absolute; 
z-index:9999; 
color:#fff;

出典

2012-04-20 17:49:17

それはない。ここ

出典

2015-09-28 21:41:03 Afzaal

答えて

関連する問題