meta viewport funcionando corretamente no telefone Android?

Question

Eu tenho tido todos os tipos de problemas usando consultas de mídia em um Desire HD porque o navegador Android torna automaticamente a página em uma resolução maior e escalas para baixo. Basicamente, ele pensa que tem uma largura de tela muito maior do que ele tem.

Eu achei que a solução para isso era para impedi-lo de escala usando a tag Meta Viewport ...

<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">

No começo isso parece ter funcionado porque está disparando a consulta de mídia correto. O telefone tem uma resolução horizontal de 480px e foi disparando minha (320px-480px) consulta de mídia.

Então, usei alguns javascript para a saída do visor computadorizada para a tela ...

var windowWidth = $(window).width();
$('div.windowWidthLabel').text("Window Width: " + windowWidth + "px");

O calculado com era 369px que eu pensei que era muito estranho. Então eu verifiquei com uma consulta de mídia que teve min e conjunto máximo para 369px e disparou (que seja pelo menos equivalente). Então porque é que o navegador acho que é 369px quando a resolução nativa é 480px?

Qualquer ajuda seria muito apreciada.

Jon

Answer 1

Não encontrou uma resposta exata para isso, mas eu estou achando que é melhor não trabalhar com resultions exatas de dispositivos quando se trata de consultas de mídia de qualquer maneira, apenas ajustar suas consultas de mídia até que os olhares conteúdo certo:)