Question

我正在使用Braintree Dropin UI：

<div id="braintree-dropin"></div>

JAVASCRIPT
    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有很多不必要的高度：

我该如何调试此程序以及可能导致这种情况的原因？我已经在生产环境和生活环境中进行了测试，并且仍然存在相同的问题。

编辑：

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

Answer 1

这是因为您的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中，最新的和更具体的规则会覆盖其他规则。

Braintree Dropin额外的高度

1 个答案: