javascript - 当存在 Parsley 错误 div 时，带有 Intl-Tel-Input 的标志会向下移动

Question

我有一个小而独特的错误，我无法在其他地方找到。在具有 intl-tel-input 的电话号码输入下方是从 Parsley.js 弹出的错误消息。这是一个没有错误的：

这是一个错误：

如您所见，当出现错误 div 时，标志和箭头向下移动。

以下是相关代码：

<div class="col-md-6">
    <input type="tel" class="form-control tc-custom-focus" id="inf_field_Phone1" name="inf_field_Phone1" minlength = '10' maxlength="14" data-parsley-error-message='Must be minimum of 10 digits' data-parsley-trigger='change' data-parsley-required autofocus>
    <input id="hidden-number" name='inf_field_Phone1' type="hidden" name="phone-full">
</div>

<script>
        $("#inf_field_Phone1").intlTelInput({
            utilsScript: 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/9.2.7/js/utils.js'
        });
        $("#become-partner-form").submit(function() {
            $("#hidden-number").val($("#inf_field_Phone1").intlTelInput("getNumber"));
          // console.log($('#hidden-number').val());
        });
    </script>

div.selected-flag 的大小似乎从 38x36 变为 38x55？如果我忘记包含任何代码，请告诉我。任何帮助将非常感激！

Answer 1

弄清楚了！为 .selected-flag 添加了一个高度，如下所示：

.intl-tel-input.allow-dropdown .selected-flag, .intl-tel-input.separate-dial-code .selected-flag {
height: 2em !important;
}

Answer 2

.iti__selected-flag{ display: block ruby !important; }