Por que meu site fica diferente no Firefox? Estou usando CSS e no Internet Explorer aparece perfeito. E agora?

Question

é a primeira vez que desenvolvo um site totalmente em CSS, e nao tive muitos problemas, mas quando fui testa-lo no firefox ficou tudo fura de lugar.

Alguém pode me dizer onde estou errando?

o arquivo css do site é esse aqui: http://www.intercambioconnexion.com.br/teste/style.css

ficarei muito agradecido se alguém puder me ajudar, obrigado!

esqueci de coloar o link do site, hehe...
http://www.intercambioconnexion.com.br/teste/

Answer 1

É normal que isso ocorra... Então respire fundo e não desanime. E vamos ao que interessa. Algumas teorias:

Não cheguei a olhar sua folha de estilos, mas pelo resultado do IE(6) e Firefox, acredito que o tamanho especificado para as colunas esteja maior do que o total permitido. Veja se o valor somado das colunas não esteja excedendo o valor do quadro pai.

Para efeito de teste, tente diminuir o tamanho e margens das colunas (boxes). Se deixar de "empurrar" a div pra baixo, então você pode ter detectado o problema.

Em relação ao menu, talvez você não tenha definido o tamanho da altura (talvez tenha ficado em "auto"). Quem sabe um valor absoluto pra esse atributo não resolve?

Ah.. não testei no IE 7, mas é bom você conferir se está funcionando corretamente no IE 7...O design tá ficando bem legal. Espero que consiga fazer os ajustes.

Um link que recomendo sobre CSS é o www.maujor.com .

Answer 2

ops!...é a forma de interpretação dos códigos que mudam conforme o browser...para concertar este detalhe, entre no google e busque por hack css, vai encontrar como fazer para deixar seu site beleza nos dois navegadores...utilizamos bastante o hack css..

flw....

boa sorte..

►1+1:3◄

Answer 3

"Este site é melhor visualisado em IE 6 ou superior" (lastimavel...)

Ou tenta montar outro site, e usa JS para redirecionar para a outra pagina caso o usuario utilize Firefox...

Answer 4

Existe uma técnica muito simples, muito útil e relativamente pouco utilizada no Brasil conhecida como CSS Signature, ou em português, "assinatura de CSS". É com essa técnica que consegue-se, por exemplo, indicar no menu de um site qual é a página atual em que o usuário está. Se você clicar em uma das páginas como feeds, referências, hosting etc. aqui do site, verá que o item de menu correspondente a página fica "selecionado", diferenciando-se do restante dos ítens do menu para indicar para o usuário qual a página atual em que ele se encontra.

Esta técnica foi desenvolvida por Eric Meyer e consiste em colocar o atributo "id" na tag do seu documento com a estrutura da sua url por exemplo, como no formato inicialmente concebido por ele:



Tendo isso no body de qualquer página, como na home por exemplo, você consegue personalizar os elementos que quiser, sobrescrevendo as regras declaradas acima na sua folha de estilos apenas nas páginas que possuiu determinado id. Quando Meyer publicou sobre isso no ano de 2001, ele estava apenas dando um exemplo do que um id no body é capaz de fazer. Desde então essa técnica foi aperfeiçoada e utilizada de formas diferentes por vários profissionais.

Algumas pessoas utilizanam-na para enriquecer a usabilidade de um site, para indicar com um estilo diferente para o usuário qual a página específica de um site ele está atualmente em menus de navegação. É uma técnica muito simples que pode ser utlizada juntamente com breadcrumb (caminho de migalhas) para enriquecer mais ainda a experiência de um usuário em sites de médio e grande porte.

Com esta técnica, você consegue criar um layout diferente para cada página do seu site, usando o mesmo XHTML, os mesmo nomes de classe e mudando apenas o id. Simples, prático e sem mistérios!

Entre neste site e leia a postagem para solucionar sua dúvida: http://www.revolucao.etc.br/archives/category/css-signature/