Tengo un mapa y por encima quiero tener un contenedor que en un futuro será un modal para contener un formulario. El problema es que este aparece debajo y yo quiero que salga encima, he estado haciendo pruebas con position
z-index
etc pero nada termina de salir. ¿Como se hace?
Mi cabez me dice que debo tener un contenedor general (Gimnasios-Contenedor) y que sea el contenedor padre y que dentro tenga mapa y modal con una posición relativa y además jugar con los z-index
#Gimnasios-Contenedor {
padding: 20px 0;
position: absolute;
}
#map {
height: 400px;
width: 100%;
margin: auto;
margin-top: 20px;
z-index: 50;
}
#ModalContacto {
height: 300px;
width: 60%;
background-color: orangered;
margin: auto;
position: relative;
top: 20%;
z-index: 100;
}
<div id="Gimnasios-Contenedor">
<div id="map"></div>
<div id="ModalContacto"></div>
</div>