Ir para conteúdo

POWERED BY:

Arquivado

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

Tayron Miranda

[Resolvido] Borda de uma div com css não funciona no Firefor

Por , em Desenvolvimento frontend

Recommended Posts

Tayron Miranda    0

Tayron Miranda
Postado

Estou tendo um problema, estou fazendo um layout em div e css, no IE 6.0 e 7.0 aparece as bordas que coloquei no centro da pagina, mas no firefox elas simplesmente não aparecem... como resolver isso? http://forum.imasters.com.br/public/style_emoticons/default/upset.gif

 

 

------------------------------------------------ CÓDIGO >>>

<!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=iso-8859-1" />

<title>Untitled Document</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id=topo></div>
<div id=pagina>
<div id=esquerdo>Esquerdo</div>
<div id=centro> Conteúdo do site </div>
<div id=direito> Direito</div>
</div>
<div id=rodape></div>

</body>
</html>

 

 

 

------------------------------------------------ CSS >>>

body {
  text-align:justify;
  margin: 0;
  padding: 0;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  color:#666666;  
}
#pagina {
  text-align:left;
  margin: 0 auto;
  width:900px;
  height:600px;
  background:#00CCCC;
}
#topo {
  text-align:left;
  margin: 0 auto;
  width:900px;
  height:120px;
  background:#FF9900;
}
#esquerdo {
  text-align:center;
  width:140px;
  height:100%;
  float:left;
  background:#CCCCCC; 
}
#centro {
  text-align:center;
  width:608px;
  height:100%;
  float:left;
  background:#999999;
  border-right:solid 6px;
  border-left:solid 6px;
  border:#00CCCC;
}
#direito {
  text-align:center;
  width:140px;
  height:100%;
  float:left;
  background:#CCCCCC;
}
#rodape {
  text-align:left;
  margin: 0 auto;
  width:900px;
  height:30px;
  background:#FF9900;
}

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Atributos HTML, precisam de aspas duplas:

<div id="topo"></div>
Procure dar um espaço, entre a propriedade CSS, e o valor dela:

body {
  text-align: justify;
Procure usar corretamente as abreviações, para não sobrescrever estilos:

border-right: 6px solid #00CCCC;
  border-left: 6px solid #00CCCC;

Compartilhar este post

Link para o post
Compartilhar em outros sites

Tayron Miranda    0

Tayron Miranda
Postado

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif Muito obrigado, fiz o que me disse e pasou funcionar direitinho....

 

Agora como eu faço pra que uma largura de uma pagina nunca ultrapasse seu tamanho padrão caso seu conteudo vier exceder o tamanho da página?

 

Exemplo, minha pagina é 700px de largura, dai vamos supor que uma notícia acidentalmente venha ocupar um espaço superior a 700px, como faço pra evitar deformaçõs na página devido a esses tipos de imprevistos? :mellow:

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

overflow:hidden;

 

Mas vou te dizer, isso que você descreveu, é impossível ^^

ainda mais na largura.. só se você tivesse UMA UNICA palavra com mais de 700px de largura(sem espaços, pois eles causam uma quebra natural no HTML).

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