O que poderia causar o mesmo navegador em diferentes PCs para processar o mesmo HTML de forma diferente?

StackOverflow https://stackoverflow.com/questions/1224796

Pergunta

Estou perplexo. Um cliente e eu estamos ambos rodando Firefox 3.0.12 em máquinas XP. Vemos a mesma página no mesmo navegador em máquinas diferentes e têm diferentes resultados. Nota: os navegadores IE Todos são consistentes em ambas as máquinas, e meu FF 3.5.1 é compatível com o meu FF 3.0.12. (Ele não tem instalado FF 3.5.x para comparar com).

Há uma diferença 1 pixel que faz com que sua div de cabeçalho (todas as imagens, sem texto) para embrulhar. Mina é bom. Se eu expandir o seu cabeceamento por 1 px (via edição css Firebug), ele funciona.

Então, minha pergunta é o que outras variáveis ??são lá que afeta a renderização ??

Eu estou tentando pensar "fora da caixa", porque parece que ele deve funcionar exatamente o mesmo.

Nós limpou o cache do navegador. Eu fiz um diff em HTML, e que não seja um javascript datetime selo e um código de rastreamento javascript var, as fontes são idênticas.

Eu sei que esta questão seria útil com a fonte, mas o meu cliente especificamente não quer desta página ao vivo pela internet ainda. Também verifiquei a questão através de uma sessão WebEx. No início, eu não podia acreditar que teríamos resultados diferentes.

Mais alguém se deparar com algo assim antes? O que devo verificar out / debug próxima?

Editar: Há uma série de sugestões que apontam para fontes, mas os usos de cabeçalho apenas imagens. Bem, isso não é completamente verdade, existem divs que fazem parte de um menu dobrável, mas tudo isso está definido para display:none para inicialmente tornando, por isso estou pensando que é outra coisa.

Editar 2: eu mudei todos os tipos de fontes e tamanhos (ambas as configurações de fonte padrão do sistema e dentro Firefox) no meu computador para tentar replicar o problema. Eu mudei o estilo de renderização (standard vs. tipo claro). Nada. O problema é quase definitivamente não é fonte relacionados. eu vou ter que ver se posso obter mais algum acesso ao computador do cliente para replicar o problema.

Foi útil?

Solução

Uma vez que não pode dar uma olhada no local em nossos próprios navegadores, aqui é o processo que eu usaria para tentar pregar para baixo a questão:

  • começar a remover blocos de código peça por peça até que os dois navegadores têm a mesma aparência.

  • Qualquer que seja o bloco de código que você última removido que fez tudo perfeitamente alinhado (mesmo se você estiver faltando um pedaço do corpo), que há nas proximidades onde o culpado é.

  • Uma vez que você encontrou o culpado, coloque toda a volta código. Começar a andar com as fontes em primeiro lugar. fontes de mudança, tamanhos de texto remove, etc. até que você pode encontrar uma condição sob a qual os navegadores são os mesmos. Se não é um problema de fonte, começar a andar com outras partes do mesmo até que você encontrou a condição de que jogos-lo.

  • Uma vez feito isso, você vai saber o seu problema e você pode trabalhar em torno dele.

Outras dicas

Se você estiver usando o Firefox verifique se você pressione Ctrl-0 para o padrão o nível de zoom.

Eu sei que meu FF3.0 torna diferente de tudo olhar que é porque eu tenho isso definido em Preferências para usar um tamanho de fonte mínimo de 16. Eu não entendo letras miúdas outras pessoas, eu recebo um monte de escrita legível.

Além disso, estar em um Mac, as fontes padrão são sans serif, enquanto em janelas tudo é serif, que também pode alterar as larguras de fonte e alturas ainda mais.

Se alguma coisa na sua página é especificada com "em" ou unidades de "ex", eles são dependentes de tamanho da fonte.

Gostaria comparar plugins / addons.

Como sobre suas configurações de suavização de fonte - são os mesmos (Nenhum / antialias / ClearType)? Isso pode alterar a largura de um determinado texto, e pode ser apenas o que você está procurando.

Você ambos usando o mesmo tamanho exato da tela? O Firefox tentar escalar as fontes para o tamanho aparente da pessoa visualizando a página, ou para um número específico de pixels?

Uma coisa que vem à mente é instalado fontes. Se você tem uma fonte que o cliente não pode haver uma diferença de 1 pixel em um tamanho computadorizada. FF e IE poderia ser arredondamento de forma diferente, o que explicaria por que eles se comportam de forma diferente.

Eu, principalmente, de acordo com todos os "caras de fontes" mais acima, mas se isso não ajudar tente verificar a cabeçalhos HTTP uma vez que alguns cabeçalhos pode ser adicionado por proxies e tal entre o servidor eo seu cliente. Mas tente as sugestões fonte primeiro ...

Boa sorte;)

Diferentes sistemas operacionais têm diferentes motores de renderização de fontes. Vastamente diferente. Mais do que suficiente para causar pelo menos uma diferença de 1 pixel, dependendo de como você configurar seu CSS.

Meu primeiro palpite é algo a ver com a janela, eu não me lembro de isso nunca acontecer no firefox, mas tente redimensionar a janela de qualquer maneira. Também é possível que haja realmente algo 1px de largura ocupar esse espaço, como um quadro oculto ou outros enfeites. Estes podem ser completamente fora da marca desde que eu não sei como você realmente fez a coisa.

Uma solução possível está exibindo uma das imagens como pano de fundo para uma div em vez de usar um tag img, isso vai fazer com que ele simplesmente ser truncado em vez de embrulho se é 1px off.

Eu vi esse problema de uma vez, e como se viu o usuário tivesse ampliado a página, eo zoom causada matemática arredondamento problemas. Eu tinha inadvertidamente ampliada minha página a 120%, eles tinham apenas a sua normal de 100%.

Com a atualização atual no navegador, as configurações de zoom navegador tomar as configurações de dpi do sistema.

No Windows 7, a criação dpi = 125% irá produzir o efeito zoom em 100% zoom da janela do navegador.

Então, isso não está relacionado com o HTML. ou seja, para dizer as configurações de width = 300px irá produzir caixa de tamanho diferente no mesmo navegador com configurações de zoom mesmos, mas com diferentes configurações de dpi.

Dpi = 125% irá produzir caixa maior.

Então, se você quiser reduzir o nível de zoom, ou zoom no navegador pressionando ctrl + -, ou reduzir as configurações de dpi do sistema seguindo os passos

  1. Para Windows 10 http: / /www.windows10update.com/2015/05/windows-10-tutorials-79-change-dpi-scaling-level-for-displays/
  2. Para Windows 7 http://www.lawfirmsoftware.com/support/change_dpi_settings_windows_7.htm
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top