Atributos de un <div> dentro de un <iframe> Tengo un iframe en mi página web en el que se cargan los contenidos de las noticias y demás. Lo tengo configurado para que calcule la altura dependiendo del contenido de la página que abras y funciona perfectamente.
Los problemas vienen a la hora de hacer una llamada a otra página en la que el contenido tiene un <div>, ya que hay ciertos atributos que el iframe no me coge.
Por ejemplo, si le pongo <div float="left"> en firefox 3.6 me lo quita directamente, y no me muestra nada de lo que haya dentro de ese <div>. También me pasa que el IE7 me pinta los bordes del <div> aunque los tenga definidos en el CSS para que estén ocultos.
Soy nuevo en el foro y no se que os hara falta para poder ayudarme, de momento os pongo el código de la pagina principal con el <iframe> y la pagina que no me pinta en firefox y en IE si lo hace pero me dibuja el borde.
Cita:
Y esta es la página a la que llama:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Iframe autoajustable -->
<script language="JavaScript">
<!--
function calcHeight()
{
//find the height of the internal page
var the_height=
document.getElementById('resize').contentWindow.
document.body.scrollHeight;
//change the height of the iframe
document.getElementById('resize').height=
the_height;
}
//-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>
<body>
<p><a href="prueba.html" target="content">PRUEBA</a></p>
<iframe name="content" scrolling="no" onLoad="calcHeight();" id="resize" style="padding:5px; border:2px solid #2B5C83; margin-top:5px; margin-bottom:5px; text-align: center; width: 700px;">Tu Navegador no está configurado para soportar estos frames</iframe>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Iframe autoajustable -->
<script language="JavaScript">
<!--
function calcHeight()
{
//find the height of the internal page
var the_height=
document.getElementById('resize').contentWindow.
document.body.scrollHeight;
//change the height of the iframe
document.getElementById('resize').height=
the_height;
}
//-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>
<body>
<p><a href="prueba.html" target="content">PRUEBA</a></p>
<iframe name="content" scrolling="no" onLoad="calcHeight();" id="resize" style="padding:5px; border:2px solid #2B5C83; margin-top:5px; margin-bottom:5px; text-align: center; width: 700px;">Tu Navegador no está configurado para soportar estos frames</iframe>
</body>
</html>
Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prueba</title>
</head>
<body>
<div style="float:left; border:none; text-align:center;>Prueba Prueba Prueba
Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba
Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba
Prueba Prueba Prueba Prueba Prueba Prueba Prueba</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prueba</title>
</head>
<body>
<div style="float:left; border:none; text-align:center;>Prueba Prueba Prueba
Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba
Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba Prueba
Prueba Prueba Prueba Prueba Prueba Prueba Prueba</div>
</body>
</html>
Saludos y gracias!
