Foros del Web » Creando para Internet » HTML »

Tamaño de iframes

Estas en el tema de Tamaño de iframes en el foro de HTML en Foros del Web. tengo un iframe en la parte superior de mi web: Código HTML: <iframe src= "top_navigation_menu/menu.html" id = "11" name = "topmenu" style= "position:absolute;top:0%;left:0px;width:100%;height:100px;z-index:999" frameborder= "no" ...
  #1 (permalink)  
Antiguo 29/02/2012, 15:27
 
Fecha de Ingreso: septiembre-2011
Mensajes: 36
Antigüedad: 13 años, 2 meses
Puntos: 0
Tamaño de iframes

tengo un iframe en la parte superior de mi web:


Código HTML:
<iframe src="top_navigation_menu/menu.html" id = "11" name = "topmenu" style="position:absolute;top:0%;left:0px;width:100%;height:100px;z-index:999" frameborder="no"></iframe> 
hasta ahi genial, el problema es que bajo ese primer frame tengo otro, que quiero que ocupe el resto de la página, el problema es que no se que poner en el parámertro "height" porque en pixels no puede ser ya que entonces se quedaria corto segun la pantalla y si lo pongo en 100% ocupa mas que el total de la pantalla. he probado con : height:100%-100px pero nada. no tengo ni idea de que poner.
Código HTML:
<iframe src="home.php" id = "mainframe" name = "mainframe" style="position:absolute;top:100;left:0;width:100%;height:100%;z-index:999" frameborder="no"> 
  #2 (permalink)  
Antiguo 29/02/2012, 18:18
Avatar de herzbazi  
Fecha de Ingreso: febrero-2012
Mensajes: 612
Antigüedad: 12 años, 9 meses
Puntos: 36
Respuesta: Tamaño de iframes

tienes que utilizar css amigo

z-index:;
__________________
Enseña todo lo que sepas...
Aprende todo lo que puedas..
  #3 (permalink)  
Antiguo 29/02/2012, 20:00
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 5 meses
Puntos: 1567
Respuesta: Tamaño de iframes

Podés hacer algo asi
Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <title>titulo</title>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6.  
  7. <style type="text/css">
  8. /*<![CDATA[*/
  9.  
  10. html, body{
  11. padding: 0;
  12. margin: 0;
  13. height:100%;
  14. border: none;
  15. background-color: green;
  16. overflow: hidden;
  17. }
  18. iframe {
  19. padding: 0;
  20. margin: 0;
  21. }
  22. div#uno {
  23. width: 100%;
  24. height: 100px;
  25. margin: 0px;
  26. padding: 0px;
  27. background-color: blue;
  28. position: absolute;
  29. z-index: 999;
  30. }
  31.  
  32. div#dos{
  33. width: 100%;
  34. height: 100%;
  35. padding-top: 100px;
  36. background-color: red;
  37. position: absolute;
  38. top: 0;
  39. left: 0;
  40. z-index: 1;
  41. box-sizing:border-box;
  42. -moz-box-sizing:border-box; /* Firefox */
  43. -webkit-box-sizing:border-box; /* Safari */
  44. }
  45.  
  46. div#dos iframe {
  47. height: 100%;
  48. }
  49. /*]]>*/
  50. </head>
  51. <div id="uno">
  52. <iframe src="http://emprear.com" width="100%" height="100" frameborder="0"></iframe>
  53. </div>
  54. <div id="dos">
  55. <iframe src="http://forosdelweb.com" width="100%" frameborder="0" scrolling="auto"></iframe>
  56. </div>
  57. </body>
  58. </html>

los colores de fondo estan para referencia. En IE vas a notar que no llega exactamente al 100% de alto (un 99.9 digamos)
la clave esta en
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */

ya que integra los 100px de padding-top del div 2 en el alto de la misma, y no los añade.

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #4 (permalink)  
Antiguo 02/03/2012, 10:26
 
Fecha de Ingreso: septiembre-2011
Mensajes: 36
Antigüedad: 13 años, 2 meses
Puntos: 0
Respuesta: Tamaño de iframes

buahhh muchisimas gracias, muy util.
la cosa es que mi problema no acaba aqui, tengo otro frame que está en el lateral (del mismo modo que con el de arriba pero en el lado izquierdo) y me desplaza el frame central hacia la derecha de manera que no puedo ver la scrillong bar.

alguna idea de como evito eso?

Etiquetas: frame, iframe, pixels, porcentage, posicion, positioning, relativa
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:29.