Douglas Dall'Agnol 0 Denunciar post Postado Novembro 2, 2010 Pessoal a situação é a seguinte. Tenho de desenvolver uma página de login com um "wallpaper" de fundo, conforme a imagem abaixo: Basicamente, a página contém uma barra de topo, uma caixa de login ao centro (até aqui está ok) uma barra no rodapé, e a imagem de fundo que deve preencher toda a página e empurrar o rodapé sempre para o final da janela, pra preencher toda a janela. Ao menos acho que é +- isso hehe. O que acontece: se defino a altura da div do wallpaper para 100%, a div não preenche toda a janela, apenas até o final da caixa de login, e o rodapé fica logo abaixo, sobrando muita página em branco. Vou postar meu HTML e CSS também, peço que me ajudem a corrigir, sou novato em css, e to quebrando a cara pra tentar resolver faz dias: index.html: <!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>Painel Administrativo</title> <link rel="stylesheet" type="text/css" href="css/960/960.css" /> <link rel="stylesheet" type="text/css" href="css/960/reset.css" /> <link rel="stylesheet" type="text/css" href="css/960/text.css" /> <link rel="stylesheet" type="text/css" href="css/template.css" /> </head> <body> <div id="container"> <div id="template"> <div id="bar-top"></div> <div class="clear"></div> <div id="content"> <div id="box-login"> </div> </div> <div class="clear"></div> <div id="bar-bottom"></div> </div><!--template--> </div><!--container--> </body> </html> template.css: #container{width:100%; height:100%;} #bar-top{background:url(../images/bar.png) #000 repeat-x; height:60px;} #content{background:url(../images/background.jpg) #999 no-repeat top center fixed; margin:0 auto; width:100%; height:100%; float:left;} #bar-bottom{background:url(../images/bar.png) #000 repeat-x; height:60px;} #box-login{background:url(../images/box-login.png) no-repeat top center; display:block; margin:0 auto; margin-top:100px; width:322px; height:282px;} Compartilhar este post Link para o post Compartilhar em outros sites
Henrique Barcelos 290 Denunciar post Postado Novembro 2, 2010 Coloque no fundo do body e também adicione isso ao CSS: html, body { height: 100%; } Compartilhar este post Link para o post Compartilhar em outros sites
Douglas Dall'Agnol 0 Denunciar post Postado Novembro 2, 2010 Opa, valeu cara! Isso resolveu o problema da imagem de fundo. Agora tá preenchendo certinho toda a página com a imagem de fundo. Só tenho de ver agora como colocar o rodapé pra "colar" na parte de baixo da janela, ele ainda ta ficando abaixo da box de login. Segue a imagem: Se funcionar direitinho já coloco o código fonte da tela de login pro pessoal baixar tbm :) Compartilhar este post Link para o post Compartilhar em outros sites
Evandro Oliveira 331 Denunciar post Postado Novembro 3, 2010 http://maujor.com/tutorial/rodape-embaixo-da-janela.php Compartilhar este post Link para o post Compartilhar em outros sites
