Ir para conteúdo
Fórum Script Brasil
  • 0

Problema com o site/mozilla


paulochagass

Pergunta

Estou com problemas na vizualização de minha pagina no Mozilla, no Google Chrome ela está perfeitamente do jeito que projetei, mas no Mozilla aparece tudo fora do lugar... Simplesmente o meu código CSS não se aplica a pagina.

Aqui o codigo Html de meu site:

<!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>Vrum Download</title>
<link rel="stylesheet" type="text\css" href="estilo.css">
</head>
<body>
<div id="topo">
<a href="#"><img src="imagens/logo.gif" id="logo"></a>
<img src="imagens/busca.gif" id="busca">
<p id="forum"><a href="#" class="class1">Forum</a></p>
<p id="suporte"><a href="#" class="class1">Suporte</a></p>
</div>
<div id="menu">
<p id="botoes">Home Programas Games Anuncie Contato</p>
</div>
<hr id="divisor">
</body>
</html>
Aqui o codigo css do site:
body {font-family: Tahoma, verdana;
      background-color: #FFF;
      margin-left:-8px;
      margin-top:-8px;}
/* Daqui começa as regras para algumas tags. ex:p, hr, b.*/
p {font-size:14px;
   font-weight:bold;}
a.class1:link, a.class1:visited {text-decoration: none;
                                 color:#000}
a.class1:hover {text-decoration:none;
                color: #F22}
/*tudo que estiver entre topo e menu faz parte do topo*/
#topo {position:relative;
       background-color: #FFF;
       width:1368;
       height:115px;}
#logo {position:absolute;
       margin-top:20px;
       left:175px;}
#busca {position: relative;
        left:500px;
        top:50px;}
#forum {
    position:absolute;
    right:175px;
    top:43px;
    font-weight:bold;
}
#suporte {
    position:absolute;
    right:300px;
    top:43px;
    font-weight:bold;
}
#menu {position:relative;
       width:1368px;
       heigth:auto;
       top:-14px;
       background-color:#FE8340;
       word-spacing:30px;
       text-align:center;}
#divisor {position:absolute;
          right:375px;
          height:100%;}

Aqui as imagens de como fica Google Chrome e Mozilla:

Google Chrome:

googlechromeg.jpg

Mozilla:

mozillag.jpg

Por favor me ajudem!

Editado por paulochagass
Link para o comentário
Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

  • 0
Estou com problemas na vizualização de minha pagina no Mozilla, no Google Chrome ela está perfeitamente do jeito que projetei, mas no Mozilla aparece tudo fora do lugar... Simplesmente o meu código CSS não se aplica a pagina.

Aqui o codigo Html de meu site:

<!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>Vrum Download</title>
<link rel="stylesheet" type="text\css" href="estilo.css">
</head>
<body>
<div id="topo">
<a href="#"><img src="imagens/logo.gif" id="logo"></a>
<img src="imagens/busca.gif" id="busca">
<p id="forum"><a href="#" class="class1">Forum</a></p>
<p id="suporte"><a href="#" class="class1">Suporte</a></p>
</div>
<div id="menu">
<p id="botoes">Home Programas Games Anuncie Contato</p>
</div>
<hr id="divisor">
</body>
</html>
Aqui o codigo css do site:
body {font-family: Tahoma, verdana;
      background-color: #FFF;
      margin-left:-8px;
      margin-top:-8px;}
/* Daqui começa as regras para algumas tags. ex:p, hr, b.*/
p {font-size:14px;
   font-weight:bold;}
a.class1:link, a.class1:visited {text-decoration: none;
                                 color:#000}
a.class1:hover {text-decoration:none;
                color: #F22}
/*tudo que estiver entre topo e menu faz parte do topo*/
#topo {position:relative;
       background-color: #FFF;
       width:1368;
       height:115px;}
#logo {position:absolute;
       margin-top:20px;
       left:175px;}
#busca {position: relative;
        left:500px;
        top:50px;}
#forum {
    position:absolute;
    right:175px;
    top:43px;
    font-weight:bold;
}
#suporte {
    position:absolute;
    right:300px;
    top:43px;
    font-weight:bold;
}
#menu {position:relative;
       width:1368px;
       heigth:auto;
       top:-14px;
       background-color:#FE8340;
       word-spacing:30px;
       text-align:center;}
#divisor {position:absolute;
          right:375px;
          height:100%;}

Aqui as imagens de como fica Google Chrome e Mozilla:

Google Chrome:

googlechromeg.jpg

Mozilla:

mozillag.jpg

Por favor me ajudem!

Olá!

Testei teu código no Chrome e no Firefox e funcionou perfeitamente.

Contudo existe uma boa forma de programar, e sugiro que a implemente no seu código, já que fica mais legível, mas adaptável e os navegadores podem entender com mais facilidade às tags do CSS.

Abraços.

Link para o comentário
Compartilhar em outros sites

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.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,4k
×
×
  • Criar Novo...