Ver Mensaje Individual
  #1 (permalink)  
Antiguo 28/02/2012, 05:21
phoenix_ny
 
Fecha de Ingreso: diciembre-2010
Mensajes: 6
Antigüedad: 13 años, 4 meses
Puntos: 0
Problema con iframe height

Hola,

Estoy empezando con el diseño web (mi primer mensaje por cierto :D), estoy usando iframes y tengo un problema para hacer que dicho iframe ocupe el 100% de la pantalla (en height, no en width), teniendo en cuenta que en la parte superior de la misma tengo un header con un height de 90px. Este es mi código:

Código HTML:
<div class="page">
    <div class="header">
    </div>
    <div id="lateral" class="lateral">
        <iframe id="iFrameLateral" runat="server" src="Lateral.aspx">
        </iframe>
    </div>
    <div class="main">
    </div>
</div> 
El código CSS:

Código CSS:
Ver original
  1. html,body
  2. {
  3.     margin:0;
  4.     padding:0;
  5.     height:100%;
  6. }
  7.  
  8. iframe
  9. {
  10.     height:100%;
  11.     display:block;
  12.     width:100%;
  13.     border:none;
  14.     bottom:0px;
  15. }
  16.  
  17. .header
  18. {
  19.     height:90px;
  20.     position:relative;
  21.     clear:both;
  22.     width:100%;
  23. }
  24.  
  25. .lateral
  26. {
  27.     top:90px;
  28.     overflow-x:hidden;
  29.     overflow-y:auto;
  30.     float:left;
  31.     height:100%;
  32.     bottom:0px;
  33. }
  34.  
  35. #iFrameLateral
  36. {
  37.     width: 245px;
  38.     left:0;
  39.     height:100%;
  40. }

El problema que tengo, es que al poner top:90px;, se pierden esa cantidad de pixeles por debajo del bottom y que no se ven ni puedo acceder a ellos. No consigo que se vea el 100% de verdad del espacio restante, es decir, desde el top:90px hasta el bottom 0.

¿Alguien sabe cómo podría hacer? Muchas gracias!!