Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

rettich

rodape

Por , em Desenvolvimento frontend

Recommended Posts

rettich    0

rettich
Postado

galera sou novo em webstandards e ainda tenho duvidas.

 

tava desenhando o layout da minha página ae tive problemas qd testei no firefox, o rodape, fico la em cima, ja no IE funcionou perfeitamente.

 

codigo html

<body>
<div id="corpo">
<div id="header">
	<div id="topo"></div>
</div>
<div id="content">
	<div id="cont-corpo">
		<div id="cont-left"></div>
		<div id="cont-right"></div>
	</div>		
</div>
<div id="footer">
	<div id="rodape"></div>
</div>	
</div>
</body>

 

meu css

/********************************** Estilos Padrão **********************************/
*{
margin: 0%;
padding: 0%;
list-style: none;
text-decoration:none;
}
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
}
html, body { height: 100%;}
/********************************** Estilos Padrão **********************************/


/********************************** CORPO **********************************/
#corpo{
position:absolute;
width:100%;
left: 50%;
margin: 0px 0px 0px -50%;
background:#fff;
}
html>body #corpo{
width:auto;
min-width:40%;
height:auto;
min-height:100%;
}
/********************************** CORPO **********************************/


/********************************** HEADER **********************************/
#header{
position:relative;
width:100%;
top:0%;
}
#topo{
margin:5px;
padding:5px;
border:1px solid #DCDCDC;
height:50px;
}
/********************************** HEADER **********************************/


/********************************** CONTENT **********************************/
#content{
position:relative;
width:100%;	
}
#cont-corpo{
margin:3px;
padding:3px;
}
#cont-left{
width:20%;
left:0px;
height:600px;
float:left;
border:1px solid #DCDCDC;
}
#cont-right{
width:79%;
right:0px;
height:600px;
float:right;
border:1px solid #DCDCDC;
}
/********************************** CONTENT **********************************/


/********************************** FOOTER **********************************/
#footer{
position:relative;
width:100%;
}
*html #footer{ margin: 0px 0px -1px 0px;}
#rodape{
margin:5px;
padding:5px;
border:1px solid #DCDCDC;
height:50px;
}
/********************************** FOOTER **********************************/

 

falo http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

adiciona o q está em negrito... ;) soh naum entendi o porquê d colocar um div footer e um outro div rodape dentro...

 

#footer{

position:relative;

width:100%;

clear: both;

}

Compartilhar este post

Link para o post
Compartilhar em outros sites

rettich    0

rettich
Postado

é que eu uso o position relative, fica tudo em baixo do outro, certo?ae se usar o footer, ele fica junto com o de cima, ae no rodape, eu crio um padding com o footer, ficando separado um do outro.todo eu faço isso.to certo? ou tem outro modo de ser feito?? :wacko:

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

depende bastante da estrutura, etc... mas poderia deixar assim:

<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt" lang="pt"><head><title>Teste</title><style type="text/css">body {font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 9px;margin: 5px;padding: 5px;}#corpo{width: 100%;}#topo{width: 100%;border: 1px solid #DCDCDC;height: 50px;margin-bottom: 10px;}#content{width: 100%;clear: both;margin-bottom: 12px;height:600px;}#cont-left{width: 20%;float:left;border:1px solid #DCDCDC;height:600px;}#cont-right{width:79%;float:right;border:1px solid #DCDCDC;height:600px;}#rodape{border:1px solid #DCDCDC;height:50px;clear: both;}</style></head><body>	<div id="corpo">		<div id="topo"></div>		<div id="content">			<div id="cont-left"></div>			<div id="cont-right"></div>		</div>		<div id="rodape"></div>	</div></body></html>

bem mais limpo e simples... ;)

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito