
pegar un div en la parte inferior del navegador
Publicado por lvan (1 intervención) el 26/12/2013 11:30:39
hola, bueno soy nuevo con css y he estado desarrollando una pagina con 2 divs:
El primero el div con id="panel-inferior" que va pegado a la parte inferior del navegador y que tiene una altura fija de 200px.
El segundo el div con id="mapa" el que debe ocupar el espacio restante, es aqui donde tengo el problema he intentado muchas cosas pero no puedo lograr que el div mapa se adapte automaticamente al tamaño restante.
Alguien puede indicarme como hacer esto, que estilos le debo aplicar a mapa?
adyunto el codigo que utilizo:
HTML:
CSS:
saludos y gracias de antemano..
El primero el div con id="panel-inferior" que va pegado a la parte inferior del navegador y que tiene una altura fija de 200px.
El segundo el div con id="mapa" el que debe ocupar el espacio restante, es aqui donde tengo el problema he intentado muchas cosas pero no puedo lograr que el div mapa se adapte automaticamente al tamaño restante.
Alguien puede indicarme como hacer esto, que estilos le debo aplicar a mapa?
adyunto el codigo que utilizo:
HTML:
1
2
3
4
5
6
7
8
9
<div id="mapa">
div mapa
</div>
<div id="panel-inferior">
<label for="origen"><span class="titulo">origen:</span>
</label> <input type="text" id="origen" />
<input type="submit" id="btnBuscar" value="buscar " >
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#panel-inferior{
width:100%;
height:200px;
position:fixed;
bottom:0px;
z-index:10;
}
#mapa{
width:100%;
height:100%;
margin-top:-200px;
}
Valora esta pregunta


0