Acreditamos que a maioria dos desenvolvedores web, gostam muito do querido navegador Firefox!
E então veio sua nova versão que em sua primeira semana possuia 9 mil downloads por minuto. Ualll
Contudo, muitos desenvolvedores foram pegos por algumas diferenças entre a versão 2 e 3 do navegador (isso inclui a Google, muitos de vocês e nós, School of Net).
Em nosso site do pré-lançamento, nosso menu horizontal estava funcionando perfeitamente no Firefox 3 (FF3), porém no Firefox 2 (FF2) tínhamos uma diferença de 1px no atributo padding-top.
Abaixo seguem algumas hacks para conseguirmos ajustar nossas aplicações entre as duas versões do browser:
#qualquerelemento, x:-moz-any-link, x:default {}
Em nosso caso (site de pré-lançamento):
#menu ul li a,x:default { padding:6px 16px 10px 16px;} /* Somente funciona no FireFox 3 */
Outras hacks (citadas em http://diegofranco.net/archives/css-hacks-para-o-firefox-3):
/* Hack for Firefox 3 */
.nomedasuadiv, x:default { atributos }
/* Hack for Firefox 2 */
.nomedasuadiv, x:-moz-any-link { atributos }
/* Hack for Internet Explorer 7 */
.nomedoseuelemento { *display:none; }
/* Hack for Internet Explorer 6 */
.nomedoseuelemento { _display:none; }
/* Hack for Opera */
@media all and (min-width: 0px){
.content { }
}
Segue um forum muito bom sobre esses pontos!
http://forums.mozillazine.org/viewforum.php?f=25
Qualquer dúvida, sugestão ou experiência, não hesite em comentar esse post!
Loading ...
Olá!
Cheguei aqui por acaso, procurando por css hack para IE e Firefox 3.
Tive um problema parecido com esse, mas o meu problema vcs ainda tem atualmente.
Testem o menu no IE 6.
A área útil dele vai ser somente a parte escrita do menu, já fo FF ocupa o quadrado inteiro. Isso pq o IE só aceita a área toda, se estiver declarado um width no a.
Resolvi com um hack para o IE, declarando um tamanho:
.menu a { *width:56px; }
E outro para o FF, compensando com padding:
.menu a, x:-moz-any-link { padding: 5px 8px; }
Um detalhe, x:default tb foi reconhecido pelo IE 6!
Aí usei o x:-moz-any-link e deu certo.
Abraço!
Giovani
Caro Giovani,
Primeiramente, obrigado pela colaboração.
Em relação ao: .menu a { *width:56px; } você teria que setar um tamanho fixo para cada item?
Em relação ao x:default, verificamos isso para diferenciar entre ff2 e ff3 e tb adotamos o x:-moz-any-link.
Abraços
E contamos com suas visitas e contribuições.
Olá!
Isso, no seu caso, no
#navigation ul li a
teria que setar um *width mínimo para o IE reconhecer a área toda.
Pra mim foi realmente necessário pq havia um submenu com onMouseOver na barra principal.
Estive dando uma olhada no conteúdo do site, e gostei bastante!
Parabéns!
abraço..
Obrigado Giovani,
De qualquer forma, quando esse mínimo for totalmente dinâmico não pode não funcionar em alguns casos.
De qualquer forma, faremos um novo post sobre hacks, FFs e IEs e com certeza levaremos seus pontos em consideração, faremos algo mais prático…
Até mais.