Jump to content
Fórum Script Brasil
  • 0

Problema com o site/mozilla


paulochagass

Question

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!

Edited by paulochagass
Link to comment
Share on other sites

1 answer to this question

Recommended Posts

  • 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 to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.



  • Forum Statistics

    • Total Topics
      152.2k
    • Total Posts
      652k
×
×
  • Create New...