CSS CALC在Chrome中工作，但在Android 4.4.2上的PhoneGap应用中不起作用

Question

我使用以下规则

.topbtns
{
 position:absolute;
 bottom:95vh;
 right:0;
 left:0;
 top:calc(95vh - 21vw - 1.2em);
 text-align:center;
}

用于定位屏幕的一对按钮

的底部中心

<div class='topbtns'>
<div class='tear t-tosponsor'><div>View Storefront</div></div>
<div class='tear t-continue' id='btnContinue'><div>Continue</div></div>
</div>

这在Windows上的Chrome浏览器中完美工作 - 即使设备仿真打开了。$('.topbtns')[0].getBoundingClientRect()返回

{top: 538.2374877929688, right: 375.20001220703125, bottom: 
 538.2374877929688, left: 0, width: 375.20001220703125…}

但是，当我使用相同的html＆amp;CSS并将其构建到我的Android Phonegap应用程序.topbtns中无处可见。相同的getBoundingClientRect代码返回

{height:111,width:360,left:0,right:360,bottom:-497.875,top:-60}

我认为这可能是因为

• Android WebView不了解vh单位。但是，我修改了使用"底部：95VH; top：75vh}的规则。
• 我还用-webkit-calc替换calc，但无济于事。

好像calc及其-webkit-calc表弟在WebView本身时不了解vh。

我有义务向可能表达这件事的人。在写这篇文章时，我遇到了这一点-http：//slides.com/html5test/the-android-browser#/。但是，我尚不清楚PhoneGap使用的网络浏览量是这里讨论的。

Answer 1

我相信这可以帮助您，在某些版本的Android（＆lt; = 4.4.4）中不支持calc功能，因此问题不是Phonegap/Cordova，是设备您测试可能不支持它的地方