mrguz Postado Junho 9, 2011 Denunciar Share Postado Junho 9, 2011 (editado) Tenho um problema que não estou conseguindo resolver:a minha pagina tem 4 divs e dentro de um deles um iframe,Div areatotal onde todo o site ficará dentroDiv header onde fica os menus de navegação, logo e banner colado la no topo da paginaDiv content onde ficara o iframe mostrando o conteudo de paginas do site ou pagina externaDiv footer onde fica o rodapé do site com alguns links e direitos autorais sempre colado lá em baixo no rodapé da paginaO problema é:está tudo perfeito a não ser o iframe.. ou seria a Div content?, que aparece de um tamanho fixo médio que não sei porque.Se eu definir um height fixo no iframe do css como 900px ele passa pelo rodapé e o div footer não funciona a contento.Preciso que o iframe ou a Div content tivesse o seu height automatico em 100% do restante do Layout.No caso de usar Width:100% e height:100% na Div areatotal pego todo o tamanho da janela de navegação certo?porque a Div areatotal deve ser igual ao tamanho da janela do meu navegador e não da resolução do monitor.Ex. com valores ficticios da janela em 1000px X 700px :Div areatotal = Width:100% e height:100% que vai pegar (width:1000px; height:700px;)Div header = Width:100% e height:180px que vai pegar (width:1000px; height:180px;)Div footer = Width:100% e height:40px que vai pegar (width:1000px; height:40px;)Div content = Width:100% e height:100% que vai pegar (width:1000px; height:480px;) /* O 480px é = 700 - (180+40)dos outros divsneste caso o iframe que é:iframe = Width:100% e height:100% deveria ficar no mesmo tamanho de (width:1000px; height:480px;)Detalhe não posso ter rolagem na pagina (Layout) se der rolagem só pode ser no iframe (daí não tem problema).Será que estou esquecendo alguma coisa ou faltando algo?Dá para fazer apenas no CSS ou precisa de Javascript, jQuery...?Alguém pode me dar uma ajuda? Segue o código abaixo para testes:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style> *{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } html, body{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } iframe{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; border: none; text-align:center; width:100%; height:100%; } #areatotal{ min-height: 100%; width:100%; height:100%; } #header{background-color:#000060; color:#ffffff; width:100%; height:180px; text-align:center; } #content{background-color:#9999ff; width:100%; height:100%; text-align:center; } #footer{background-color:#000060;color:#ffffff; width:100%; height:40px; text-align:center; position:absolute; bottom: 0; } </style> </head> <body> <div id="areatotal"> <div id="header">top</div> <div id="content"> <iframe id="Conteudo" name="Conteudo" src="http://www.uol.com.br" frameborder="no"></iframe> </div> <div id="footer">rodape</div> </div> </body> </html> Editado Junho 10, 2011 por mrguz Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 mrguz Postado Junho 14, 2011 Autor Denunciar Share Postado Junho 14, 2011 Será que alguém tem o conhecimento necessário para resolver o problema? :huh:Achei que fosse algo simples para programadores web experientes! :(De qualquer forma, agradeço aos que tiveram boa vontade de ao menos olhar o post, mesmo não sabendo como resolver. ;) Citar Link para o comentário Compartilhar em outros sites More sharing options...
Pergunta
mrguz
Tenho um problema que não estou conseguindo resolver:
a minha pagina tem 4 divs e dentro de um deles um iframe,
Div areatotal onde todo o site ficará dentro
Div header onde fica os menus de navegação, logo e banner colado la no topo da pagina
Div content onde ficara o iframe mostrando o conteudo de paginas do site ou pagina externa
Div footer onde fica o rodapé do site com alguns links e direitos autorais sempre colado lá em baixo no rodapé da pagina
O problema é:
está tudo perfeito a não ser o iframe.. ou seria a Div content?, que aparece de um tamanho fixo médio que não sei porque.
Se eu definir um height fixo no iframe do css como 900px ele passa pelo rodapé e o div footer não funciona a contento.
Preciso que o iframe ou a Div content tivesse o seu height automatico em 100% do restante do Layout.
No caso de usar Width:100% e height:100% na Div areatotal pego todo o tamanho da janela de navegação certo?
porque a Div areatotal deve ser igual ao tamanho da janela do meu navegador e não da resolução do monitor.
Ex. com valores ficticios da janela em 1000px X 700px :
Div areatotal = Width:100% e height:100% que vai pegar (width:1000px; height:700px;)
Div header = Width:100% e height:180px que vai pegar (width:1000px; height:180px;)
Div footer = Width:100% e height:40px que vai pegar (width:1000px; height:40px;)
Div content = Width:100% e height:100% que vai pegar (width:1000px; height:480px;) /* O 480px é = 700 - (180+40)dos outros divs
neste caso o iframe que é:
iframe = Width:100% e height:100% deveria ficar no mesmo tamanho de (width:1000px; height:480px;)
Detalhe não posso ter rolagem na pagina (Layout) se der rolagem só pode ser no iframe (daí não tem problema).
Será que estou esquecendo alguma coisa ou faltando algo?
Dá para fazer apenas no CSS ou precisa de Javascript, jQuery...?
Alguém pode me dar uma ajuda?
Segue o código abaixo para testes:
Editado por mrguzLink para o comentário
Compartilhar em outros sites
1 resposta a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.