Question

html, body { 
     position:absolute; 
     width:100%; 
     height:100%; 
     margin: 0; 
     padding: 0; 
     overflow: hidden; 
}

The window.innerWidth return different number from FX and chrome
FX return 1429 while Chrome return 1159 , Why is the difference and how to fix it? Thanks.

Answer 1

It because the with of the document depends on how much of the viewport is available for the application body.

It will depend on the thickness of the borders of the application, any other plugins which are active etc.

demo here. This will alert the width of the browser, for me chrome is giving 677 while firefox is giving 674

var body = $('body')
alert(body.width() + ' - ' + body.innerWidth())