No me funciona el responsive designed que hago mal?

[minombreesmm]

veran basandome en esta pagina http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

CSS3media Regla

Ejemplo
Cambiar el color de fondo si el visor es de 480 píxeles de ancho o más ancho:

Código CSS:

@media screen and (min-width: 480px) {
    body {
        background-color: lightgreen;
    }
}
 

aplico eso en mi código pero no funciona.

mi coligo es este:

Código CSS:

@media screen and (min-width:640px){
 
#cuadros{
        width:300px;
}
.hiddencon {
    display:none;
}
 
.menu-up {
    display: inline-block;
    margin-top: 5px;
    height: 35px;
    width: 640px;
}
}
 

con un javascript saco la resolucion de pantalla de mi celular y me regresa que tengo 640x360 pixeles.. entonces hago la condicion media con 640px y no funciona, no entra a la condicion, no ejecuta las instrucciones css, pero sin embargo hace rato puse una condicion diferente

Código CSS:

@media screen and (max-width:1000px){
 

y funcionó, si le piona 999px no funcionaba entonces deduje que era sumando el ancho mas el alto 640+360px = 1000px
pero de pronto cale con otras formas hasta que regrese otra vez a la misma pero dejó de funcionar, y ahora en vez de poner 1000px en la condicion, solo funcionaba con 979px.
esta raro.

las pruebas las estoy haciendo en mi celular por que las herramientas de los navegadores me dan resultados diferentes y no muy precisos a los que según me deberían dar en un celular.

si lo que dice la pagina de arriba es correcto no debería tener ningún problema.
pero por que ocurre esto con mi código?
se las mande a unos amigos y es el mismo problema.

uso google chrome en el celular

actualizacion..
Tambien cale con opera mini pero el javascript me da otra altura y otro width

mi javascript es este

Código Javascript:

<script language="JavaScript" type="text/javascript">
        
        <!--
        //This script was found at the JavaScript Place. http://www.javaplace.co.uk
        var height=0; var width=0;
        if (self.screen) {     // for NN4 and IE4
            width = screen.width;
            height = screen.height
            document.writeln('width '+ width+' altura '+height);
            }
        else
        if (self.java) {   // for NN3 with enabled Java
            var jkit = java.awt.Toolkit.getDefaultToolkit();
            var scrsize = jkit.getScreenSize();
            width = scrsize.width;
            height = scrsize.height; 
            document.writeln('java width '+ width+' altura '+height);
        
            
        }   
        else {
        document.writeln('Tu Resolucion de Pantalla no puede ser determinada')
        
        }
        
        //-->
    </script>
 

añadi esta linea en los metas

Código HTML:

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

ambos navegadores me muestran resultados diferentes en las mediasquerys
de antemano gracias