条纹结帐模式键盘涵盖小型设备上的输入和支付按钮答案

【问题标题】：Stripe checkout modal keyboard covers inputs and payment button on small devices条纹结帐模式键盘涵盖小型设备上的输入和支付按钮
【发布时间】：2019-12-27 05:58:45
【问题描述】：

编辑：这是针对使用 Ionic 4 制作的混合移动应用程序。

在较小的设备（甚至比所附图片更小）上，输入被 Android 和 iOS 上的键盘覆盖。对于这个问题，让我们专注于android。

在这个项目的这个阶段，我不想使用条纹元素。

我已经为此寻找了很长时间，甚至联系了条带支持，但没有找到解决方案。
我附上了问题的图片（在较小的手机上更糟），以及如果您在移动浏览器上以 chrome 打开它的外观图片。

我现在的选择似乎是：

1) 破解 CSS 2) 尝试弄清楚如何让它像在移动浏览器中一样显示（第二张图片），因为这对设备尺寸的响应性更强。

【问题讨论】：

标签： android ionic-framework stripe-payments ionic4

【解决方案1】：

Legacy Checkout 应始终打开一个新页面/标签，并像第二个屏幕截图一样填满屏幕。唯一的例外是页面已配置为“网络应用”模式。

您的网站上是否恰好有以下元标记？

<meta name="apple-mobile-web-app-capable" content="yes">

如果是这样，如果您将其删除，那么 Checkout 应该会按预期运行。

另一个解决方案是使用新的 Checkout，它总是会打开一个新标签：https://stripe.com/docs/payments/checkout/client

【讨论】：

它是一个混合移动应用程序。它使用 Ionic 4 并在移动 webview 中运行。它确实有那个确切的元标记，但如果我删除它对 Android 没有帮助，是吗？不知道如果我删除它会做什么应用程序的其余部分......仍在学习。
我尝试在 iOS 版本中删除标签，但似乎没有什么不同。我希望条纹 iframe 已打开滚动。
它实际上也会影响 Android。这个想法是，如果您为一个浏览器设置 Web 应用程序模式，您可能打算为所有浏览器设置它。