10

とを使用したページに全幅のグーグルマップがありheight="100%"ますwidth="100%"。私はそれの上にいくつかのcssdivのものを置くことを知りたいです。動作するなどの負の値を使用すると機能することを読みmargin-top: -500px;ましたが、divの背景に色を割り当てようとすると、マップ上に表示されず、マップの下に表示されますが、そうではありません。私が欲しいもの。これに対する解決策はありますか？コード：

<iframe width="100%" height="100%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?hl=en&amp;ie=UTF8&amp;ll=37.0625,-95.677068&amp;spn=56.506174,79.013672&amp;t=m&amp;z=4&amp;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;
}
4

4 に答える 4

16 
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-20T17:48:51.797 に答える
2

これをcssに追加します。少なくともクロムで動作します

position:absolute;
z-index:9999;
color:#fff;
于 2012-04-20T17:49:17.047 に答える
1

スタイルを設定する div は、マップの下ではなく上に表示されるように、絶対に配置し、正の z-index を指定する必要があります

于 2015-09-28T21:41:03.390 に答える