移动端h5适配不同高度的机型，巨坑！！！

最近给公司做一个活动页面，遇到了一个没有遇到过的问题。
我写了一个页面，在页面的最下面，有一个动态按钮，点击可以向下滑动，如下图

这些东西要在一个页面上全部显示出来，然后出问题了；
我的手机与老总的手机宽度一样，但是我的较长一点，然后就出现了下面的问题；

长度较短的手机不显示所有的内容，无论你怎么设置都没有办法；
原因是，宽度一样的话，图片的长度都是一样的，我们适配的都是手机宽度，很少有适配手机长度的；
如果想宽度一样，长度不一样的机型显示所有的内容，那么你两个解决方案；
第一个，jq动态获取手机可视高度，然后去压缩页面内组件的高度；
第二个，判断登录来源的机型，然后给每一个尺寸机型写一个单独的页面；

当然这两个办法都太麻烦，效率不高；

最好的解决办法就是：

一般手机屏幕尺寸最小的也是5.7的了，所以在编写页面的时候，需要一部5.7的手机适配，只要这种尺寸的手机没有问题，其他款式的手机，基本都没有问题；

ps：另外附属一句话，在屏幕下面留白的话，可能会影响美观，这个时候就需要公司的ui去设计了