div sur le dessus de div avec Google Maps API

Question

Comment faire flotter un div "menu" sur mon div "map" API Google Maps. Et peut-être ajouter éventuellement une transparence de 50% sur le menu div. Cela peut-il être fait?

#map {width: 835px; height 540px; float: left;} 
#menu {width: 145px; float: right; padding-top: 10px;} 

<div id="map"></div> 
<div id="menu"></div> 

Answer 1

Ne peut pas vous changer les positions du DIVs comme celui-ci:

<div id="menu"></div> 
<div id="map"></div> 

Si vous ne pouviez pas aller quelque chose comme ceci:

<div id="map"></div> 
<div id="menu"></div> 

#menu 
{ 
    position: absolute; 
    top: 10px; /* adjust value accordingly */ 
    left: 10px; /* adjust value accordingly */ 
} 

Mise à jour 2

Cross- style de transparence du navigateur:

.dropSheet 
{ 
    background-color: #000000; 
    background-image: none; 
    opacity: 0.5; 
    filter: alpha(opacity=50); 
} 

Appliquez simplement la classe dropSheet à l'élément que vous souhaitez rendre transparent.

Answer 2

Eh bien, la structure de base d'un flotteur doit contenir un élément d'emballage qui a sa propriété de position définie à quelque chose d'autre que la valeur par défaut, et un élément qui efface le flotteur à la fin.
Comme ceci:

#wrapper { 
    position:relative; 
} 
#menu { 
    float:right; 
} 

<div id="wrapper"> 
    <div id="map"></div> 
    <div id="menu"></div> 
    <br clear="both" /> 
</div> 

Le code fourni n'a pas été spécialement testé, mais le flotteur et le fait que le menu est la couche supérieure à la carte, devrait faire le menu en haut de la carte dans le droit côté. Pour le problème de transparence, voir this fantastic resource.

J'espère que cela vous a aidé.