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

CSS não funciona no FireFox


marvi

Pergunta

Olá pessoal,

Estou montando um site e fiz algunas tabelas principais, como a tabela mãe e tal configurada no CSS, tive uma dor de cabeça, mas conseguir fazer ele ler legal no Internet Explorer, só que no firefox ele não ler como eu quero... minha CSS é:

<style type="text/css">
<!--
* { margin: 0; padding: 0; }
body {background-image: url('imagens/topo.gif'); background-repeat: repeat-x; }
#conteudo { margin: 45 auto;  text-align: left; position: relative; min-height: 100%; height: auto; height: 80%; background-image: url('imagens/fundom.gif');}
#rodape {  width:100%; background-image: url('imagens/topo10.gif'); color:#fff;  bottom:0px; height: 55px; margin:0px; }
* HTML #rodape { margin-bottom:0px; bottom:-1px; }
rodape-conteudo { text-align:center; line-height: 35px;}
#frente { position:relative; margin: -25 auto;}
#demo-table {
  width: 730;
  height: 550;
border: 0px solid #f00; 
margin-left: auto;
margin-right: auto;

  }
-->
</style>

Para ver o meu site todo, tabela, div e etc, é só ver o html dele: http://www.ideiabiz.com/lab . Acesse também ele no Internet Explorer e depois no FireFox para ver a diferença, no firefox por exemplo não tem o topo da página correto, que é deixa a barra azul separada do plano de fundo cinza... Não tem também o núcleo do site, o meio em branco, em cima da barra azul no topo, só tem no rodapé e o plano de fundo cinza não vai até lá em baixo na barra do rodapé azul...

Como resolver isso?

Obrigado mesmo!

Marcelo

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

7 respostass a esta questão

Posts Recomendados

  • 0

Para resolver só fiz isso:

É só adicionar hacks nas folhas de estilo padrão:

#search {

margin: 10px 0 0 5px; /*todos os navegadores*/

*margin: 10px 0 0 5px; /* apenas para o IE*/

}

Veja que para o IE tem o * na frente...

Mas surgiu outro problema... quem poder me ajudar... é o seguinte:

Se vocês acessarem no FireFox o site que estou criando http://www.ideiabiz.com/lab1 verá que ao mudar a resolução para 800X600 o plano de fundo do meio (cor cinza) fica curto, não vai até o rodapé, ok? Se também você mudar a resolução para 1024 X 768 ele se encaixa certo... Mas, se você muda para uma resolução 1152 X 864, agora, o plano de fundo cinza do meio passa do rodapé azul...

Isso não acontece com o Internet Explorer, pois o IE se adequa, se ajusta, automáticamente em qualquer resolução, como resolver isso? Segue o CSS:

<!--
* { margin: 0; padding: 0; }
body {background-image: url('imagens/topo.gif'); background-repeat: repeat-x; }
#conteudo { margin: 45 auto; *margin: 45 auto; text-align: left; position: absolute; *position: relative; min-height: 100%; *min-height: 100%; height: auto; *height: auto; height: 138%; *height: 100%; background-image: url('imagens/fundom.gif');}
#rodape { width:100%; *width:100%; background-image: url('imagens/topo10.gif'); color:#fff;  bottom:0px; *bottom:0px; height: 71px; *height: 55px; margin:0px; *margin:0px; }
* HTML #rodape { margin-bottom:0px; bottom:-1px; }
rodape-conteudo { text-align:center; line-height: 40px; *text-align:center; *line-height: 35px;}
#frente { position:relative; margin: -25 auto; *position:relative; *margin: -25 auto;}
#demo-table {
  width: 730;
  height: 550;
border: 0px solid #f00; 
margin-left: auto;
margin-right: auto;

  }
-->

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

  • 0

Mais problemas!!!

Mais problemas... baixei o FireFox Mozilla Firefox 3.0.4 e ele não roda certo mesmo! Voltei a estaca zero! E agora, alguém pode me ajudar??

Usem o Mozilla Firefox 3.0.4 e veja a diferença dele com Internet Explorer.

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

  • 0

Cara, o site aqui está offline...

Não dá pra testar...

Ao invés de utilizar esse tipo de Hack CSS para o IE, utilize o "if IE".

Dá uma pesquisada aqui no fórum, você deve achar alguma coisa...Esse código é utilizado para colocar um código que só irá rodar no navegador Internet Explorer

Qualquer coisa, posta aí !

Link para o comentário
Compartilhar em outros sites

  • 0

Já fiz if e tal e dava uns erros, resolvir de novo, mas acho que só serve para ler na versão nova do firefox que é o 3.0.4...

Fiz: position: relative;

Mas surgiu outro problema também.... acesse: http://www.ideiabiz.com/lab1 o site está no ar sim, ou senão, http://www.ideiabiz.com/lab1/index.htm para ver se vai e verá que a barra vertical branca no meio do site, onde tem o conteudo, deveria ter o seu topo na frente da barra azul no topo, assim como é pelo Internet explorer...

Link para o comentário
Compartilhar em outros sites

  • 0

Acho que resolvi!

Ler tanto no Internet Explorer como no Fire Fox e com todas resoluções!

Se aparecer algum bug eu posto aqui de novo! Espero que não!

CSS ok:

<!--
* { margin: 0; padding: 0; }
body {background-image: url('imagens/topo.gif'); background-repeat: repeat-x; }
#conteudo {  width:100%; *width:100%; margin: 45 auto; *margin: 45 auto; text-align: left; position: absolute; *position: absolute; min-height: 100%; *min-height: 100%;  background-image: url('imagens/fundom.gif');}
#rodape { height: auto; *height: auto; height: 138%; *height: 100%; width:100%; *width:100%; background-image: url('imagens/topo10.gif'); color:#fff;  bottom:0px; *bottom:0px; height: 71px; *height: 55px; margin:0px; *margin:0px; }
* HTML #rodape { margin-bottom:0px; bottom:-1px; }
rodape-conteudo { text-align:center; line-height: 40px; *text-align:center; *line-height: 35px;}
#frente { position:relative; margin: -25 auto; *position:relative; *margin: -25 auto;}
#demo-table {
  width: 730;
  height: 550;
border: 0px solid #f00; 
margin-left: auto;
margin-right: auto;

  }
-->

Obrigado!

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,3k
×
×
  • Criar Novo...