我正在使用PhoneGap和JQueryMobile来创建我想要部署到iOS和Android的移动应用程序。该应用程序很简单，只包含3个栏：标题/搜索栏，第二个栏（显示搜索结果），剩下的屏幕是用户可以写入的。
因为我想将我的布局编码为最大的设备代码看起来相同，所以我在％s中编写了用于应用程序布局的CSS。标题是6％，第二栏是14％，等等。对于我到目前为止测试过的设备，这看起来效果不错。我遇到了一个问题，Android键盘会挤压视口高度，从而缩小我的布局。所以我将键盘设置为resizePan，这解决了压扁问题。但是现在，在用户关闭键盘之前，它的底部是不可见的。
在我看到的关于该问题的问题中，解决方案是交换到“adjustResize”，以便用户可以在键盘处于活动状态时滚动。我不能这样做，因为我想避免布局 - 挤压问题。
有没有办法解决这个问题而无需重新编写CSS？如果我必须重新编写CSS，我应该如何编写布局以在多个设备上保持一致？我是否必须为所有可能的设备使用广泛的媒体查询列表？
注意：这不是ios的问题，因为软输入键盘覆盖了textarea（如adjustPan），但仍然允许用户向下滚动并向上滚动到视图外部的文档部分或由键盘。