javascript - braintree dropin 额外的高度

标签 javascript iframe braintree

我正在使用 braintree dropin UI:

<div id="braintree-dropin"></div>
var braintree_client_token = "{{ braintree_client_token }}";

function braintreeSetup() {
    // Here you tell Braintree to add the drop-in to your division above
    braintree.setup(braintree_client_token, "dropin", {
        container: "braintree-dropin"
        , onError: function (obj) {
            // Errors will be added to the html code
            $('[type=submit]').prop('disabled', false);
            $('.braintree-notifications').html('<p class="alert alert-danger">' + obj.message + '</p>');
        }
    });
}

braintreeSetup();

生成的 dropin 有很多不必要的高度:

enter image description here 我该如何去调试这个以及什么可能导致这样的事情? 我已经在生产环境和实时环境中进行了测试,同样的问题仍然存在。

编辑:

您可以在此处查找和检查: http://floarplans.com/order/

最佳答案

因为你的 theme.css 2480 行有如下规则:

iframe {
    width: 100%;
    min-height: 350px;
    border: none;
}

如果您在 head 标签的末尾包含以下 css。

<head>
<!-- Lots of meta and link tags. -->
<style>
    iframe#braintree-dropin-frame {
        min-height: initial;
    }
</style>
</head>

这应该会将其重置为正常。因为在 css 中,最新的和更具体的规则会覆盖其他规则。

关于javascript - braintree dropin 额外的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57043447/

相关文章:

angular - 如何在 angular2 应用程序中使用 braintree 的嵌入式用户界面?

javascript - 我在哪里可以在 WordPress 中设置 CarouFredSel javascript 的持续时间?

javascript - 正则表达式每个点换行,但仅在引号之外

javascript - 使用 DateTimePicker 插件的 JQuery 不起作用

javascript - 对象作为 React 子对象无效(发现 : [object Promise])

javascript - 我如何通过该页面的 iframe 内的 javascript 控制页面?

javascript - 网站中可疑的 iFrame

javascript - 如何为 iPad 设置 iframe?

ios - Braintree 嵌入式 UI (iOS)

paypal - Braintree - 支付方式改变时的回调