[Bug] Android Native browser should extend page height if page height is smaller than window's height

I spend whole day to resolve this problem. The bug only occurred in Android native browser (less than 4.4). Chrome in Android or iOS works fine.

As following, the bottom of the page is red line. After the red line, iOS safari is not showing, bug android creates this blank area. In this case, zoom in or zoom out might appears blank area at the top which overlay my toolbar or drop-down list.

Solution is simple, just add min-height at body by using javascript:
https://gist.github.com/girvan/9478301

[viewport] setup same viewport width for iPhone and Android in responsive design

中文版在這裡

If you want to setup same viewport (e.g. 400) for iphone and android is hard.

1. width=device-width doesn't work, since each device has different default width.
   default width of iPhone/6/6+ are  320, 375 and 414
   default width of android are 320, 360 and 400
2. width=400 or width=360 doesn't work in iPhone
3. width=320, initial-scale=0.8 is not a good solution. iPhone is work, but android doesn't work except user-scalable=1

My solution is control viewport by javascript: