Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
olá pessoal, venho aqui postar depois de muito me descabelar tentando soluções...
bem, eu sei q existem alternativas para o height 100%, como o faux columns. Porém acredito que deve existir um jeito de ajeitar do modo que estou fazendo.
Bem, o que estou querendo criar é um conteudo central do site em que o tamanho seja relativo de acordo com o conteúdo. isso funciona muito bem, porém quando o conteúdo é menor do que a tela, o Internet explorer deixa a div correspondente esticada, exatamente do tamanho da minha tela. no firefox isso nao acontece, funciona perfeitamente.
estou postando um link pra mostrar. limpei o site e deixei só os fundos das divs com cor. gostaria que abrissem no IE e no FF pra verem a diferença.
http://www.add-digital.com.br/teste_css/teste.html
Muito obrigado
seguem os codigos:
* { font-family: Arial, Helvetica, sans-serif; color: #000000; margin: 0px; padding: 0px;}html{ height: 100%;}body{ margin: 0px; padding: 0px; background-color: #a5b6d5; height: 100%; } #tudo { width: 778px; height: 100%; margin: 0 auto 0 auto; padding: 0px; background-color: #f3f3f4; display: table;}#topo_um { width: 476px; height: 149px; margin: 0 0 0 5px; padding: 0px; position: relative; float: left; display: inline; background-color:#CCCC66; }#topo_dois_home { width: 287px; height: 149px; margin: 0 0 0 5px; padding: 0px; background-color: #FF99CC; position: relative; float: left; display: inline;}#menu { width: 167px; height: 500px; margin: 5px 0 20px 5px; padding: 0px; display: inline; position: relative; float: left; background-color: #009900;}#conteudo { width: 596px; height: 100%; margin: 0 5px 20px 0; padding: 0px; position: relative; float: right; display: inline; background-color: #0033FF;}#banner { width: 778px; height: 66px; background-color:#CCCCCC; position: relative; float: left; margin: 0 0 20px 0; padding-top: 0px; display: inline; text-align: center;}#rodape { width: 778px; height: 15px; text-align: center; position: relative; float: right; margin: 0 0 20px 0; padding: 0px; font-size: 9px; background-color: #9966FF; }--------<body> <div id="tudo"> <div id="topo_um"> </div> <div id="topo_dois_home"> </div> <div id="menu"> </div> <div id="conteudo"> conteudo </div> <div id="banner"> </div> <div id="rodape"> </div> </div></body>
esse troço que tu me mandou nao explica direito como usar e pra que exatamente que serve... confesso que não entendi.quer dizer que pra eu fazer o height 100% fazer funcionar eu preciso usar javascript?
Não tem como fazer isso só com css??To com o mesmo problema
Galera, sei que o tópico ta meio antigo, mas quando se procura no google o que aparece é ele. Então lá vai a resposta:
Seguinte:
No css, declare no body a propriedade height:100% , sendo assim, após isso se você colocar o height:100% numa body o IE irá respeitar.
cara, ve se ajuda...
http://www.ajaxbox.com.br/ajaxBox.Materia/...-de-height.html