当验证DIV可见时,引导网格会移动

我有下面使用引导的表单。

在某些字段出现验证错误之前,一切似乎都正常工作。当这种情况发生时,我会使反馈div可见,从而改变网格对齐。

我不确定是什么原因导致了这种情况,因为我的列大小加起来每个表单行不到12,所以它们不应该转移到下一行。任何想法都很好。

提前谢谢。

常规布局

改变布局 (当存在验证错误时)

加成

<div class="account-options account-options-banking-details row" id="divBankingDetails" runat="server">
    <hr />
    <h1>Banking Details</h1>
    <div class="account-options-banking-controls col-xs-10">
        <div class="form-row">
            <div class="form-group col-xs-5">
                <label for="txtBankName">Bank Name</label>
                <input type="text" class="form-control inputfield" id="txtBankName" runat="server">
                <div class="invalid-feedback" id="divBankNameFeedback" runat="server" visible="false">
                    Required
                </div>
            </div>
            <div class="form-group col-xs-5">
                <label for="txtAccountType">Account Type</label>
                <select class="form-control inputfield custom-select" ID="cboAccountType" runat="server">
                    <option Value="0">Choose...</option>
                    <option Value="1">Checking</option>
                    <option Value="2">Savings</option>
                </select>
                <div class="invalid-feedback" id="divAccountTypeFeedback" runat="server" visible="false">
                    Required
                </div>
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-xs-5">
                <label for="txtBankAccountNumber">Bank Account Number</label>
                <input class="form-control inputfield acct-number" name="BankAccountNumber" id="txtBankAccountNumber" runat="server">
                <span toggle=".acct-number" class="fa fa-fw fa-eye field-icon toggle-account-number"></span>
                <div class="invalid-feedback" id="divBankAccountNumberFeedback" runat="server" visible="false">
                    Required
                </div>
            </div>
            <div class="form-group col-xs-5">
                <label for="txtReenterBankAccountNumber">Re-enter Bank Account Number</label>
                <input type="text" class="form-control inputfield" id="txtReenterBankAccountNumber" runat="server">
                <div class="invalid-feedback" id="divReenterBankAccountNumberFeedback" runat="server" visible="false">
                    Required
                </div>
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-xs-5">
                <label for="txtRoutingNumber">Routing Number</label>
                <input type="text" class="form-control inputfield" id="txtRoutingNumber" runat="server">
                <div class="invalid-feedback" id="divRoutingNumberFeedback" runat="server" visible="false">
                    Required
                </div>
            </div>
        </div>
    </div>
</div>