Android browser's screen.width, screen.height & window.innerWidth & window.innerHeight are unreliable

Question

I\'m working on a web app that is targeted to browsers on desktop, tablet and smartphone.

The web app has a light box implemented using Colorbox with an iframe

Answer 1

Dan's answer fix the inconcistancy between android's browser.. so I post how I detect/change mobile viewport and adapt it when rotated (don't know if usable for any one...

var lastorg=0; //set the begining of script
thisorg=parseInt(window.innerWidth)/parseInt(window.innerHeight); //for ratio to detact orietation
if(((lastorg<1 && thisorg>1) ||(lastorg>1 && thisorg<1) ||lastorg==0 )){ //is start or change
$("#viewport").attr('content', 'width=device-width, initial-scale=1,minimum-scale=1, maximum-scale=1'); // reset viewport to device
mywidth = Math.min(window.innerWidth, window.outerWidth); //Dan's way to fix the inconsistancy
myheight = Math.min(window.innerHeight, window.outerHeight);
lastorg=thisorg;    //update the lastorg
wr=parseInt(mywidth)/1280;  // the minimum desire width
hr=parseInt(myheight)/630;  // the minimum desire height
if(hrPlease rotate your phone/tablet