Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
seguinte... estou tentando adaptar um site com iframes.....
só que.. a principio tenho 2 problemas.....
tentei pegar um codigo que adapte a altura dele mas nao funcionou(pelomenos nao do jeito que quero)
o site é dividido assim:
TOPO
PARTEPRINCIPAL
RODAPE
digamos que o TOPO dele tenha que ter 100px, e o rodape 20px....
quero que a parte principal tenha o resto da altura que o navegador ira suportar(o maximo desde que nao tenha barra de rolagem entendeu??
se eu botar 100% na autora do iframe, ele vai entender esse 100% como a altura total do site(do inicio ao fim do navegador), quero que esse ""100%"" seja do topo ao rodapé, pra nao ficar com a barra de rolagem(independente da resolucao!!!!!)........
estou tambem com outro problema....
no firefox, ele xega a passar até pra baixo do rodape( a autura que eu boto nao funciona, funciona apenas no IE, alguem pode me ajudar?????
aqui vai o codigo
<htmL>
<head>
<style type="text/css" media="all">
html, body {height:100%;} /**/
body {
margin:0;
padding:0;
background:#fff;
font:75%/1.4 Verdana, Arial, Helvetica, sans-serif;
text-align:center;
}
#tudo {
width:970px;
position:relative; /*Contexto de posicionamento */
background:#fff;
margin:0 auto;
text-align:left;
min-height:100%;/**/
border:none;
}
* html #tudo {height: 100%;}/**/
#topo {
background:#cfc;
width:970px;
height:100px;
border:none;
text-align:center;
padding-top:1px;
}
#principal {
width:100%;
height: auto;
background: pink;
padding: 0px;
text-align:justify;
}
#rodape {
background:#b0f1b0;
width:970px;
height:20px;
position: absolute;
bottom: 0; /**/
border: none;
text-align:center;
}
#rodape p {
margin:0;
font-weight:bold;
color:#060;
}
.clear {clear:both;}
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
function resizeIframe() {
i = parent.document.getElementById('IdIframe');
if(i!=null){
iHeight = document.body.scrollHeight;
i.style.height = iHeight + 35 + "px";
}
}
//-->
</script>
</head>
<body onload="resizeIframe();">
<div id="tudo">
<div id="topo"><h1>Topo</h1>
<a href="[http://www.terra.com.br"](http://www.terra.com.br) target="IdIframe">Teste</a> | <a href="teste2.html" target="conteudo">Teste2</a>
<br> <br></div>
<div id="principal">
<iframe id="IdIframe" src="teste.html" frameborder="0" scrolling="auto" noresize="noresize" height="100%" width="100%"></iframe>
</div> <!-- Fim da div#principal -->
<div class="clear"></div>
<div id="rodape"><p>Rodapé</p></div>
</div> <!-- Fim da div#tudo -->
</body>
</html>Carregando comentários...