Html 引导模式内的表单未格式化

我试图在引导模式中构建一个小表单，但它没有正确显示字段。请看下面的图片（这是正在显示的内容）

我的代码：

<div class="modal fade" id="updateToFullVersionModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button aria-hidden="true" data-dismiss  ="modal" class="close" type="button">X</button>
            <h4 id="myModalLabel1" class="modal-title"><strong>Upgrade to Full Version</strong></h4>
        </div>
        <div class="modal-body mx-3">
                <div class='form-row'>
                    <div class="col-xs-12 form-group">
                        <label class='control-label'>Name on Card</label>
                        <input class="form-control" id="CustomerNameCard" type='text' placeholder="Name on Card" >
                    </div>
                    <div class="col-xs-12 form-group">
                        <label class='control-label'>Card Number</label>
                        <input class="form-control" id="CustomerCreditCardNumber" placeholder="Credit Card Number" size="20" type='text' >
                    </div>
                    <div class="col-xs-6 form-group">
                        <label class='control-label'>Zip Code</label>
                        <input class="form-control" id="CustomerCreditCardZip" placeholder="Postal Code" size="6" type='text' >
                    </div>
                </div>
                <div class='form-row'>
                      <div class='col-xs-4 form-group cvc required'>
                        <label class='control-label'>CVC</label>
                        <input id="CustomerCreditCardCVV" class='form-control' placeholder='ex. 311' size='4' type='text' >
                      </div>
                      <div class='col-xs-4 form-group expiration required'>
                        <label class='control-label'>Expiration</label>
                        <input class='form-control' id="CustomerCreditCardExpirationMonth" placeholder='MM' size='2' type='text' >
                      </div>
                      <div class='col-xs-4 form-group expiration required'>
                        <label class='control-label'>&nbsp;</label>
                        <input class='form-control' id="CustomerCreditCardExpirationYear" placeholder='YY' size='2' type='text' >
                      </div>
                </div>
        </div>
        <div class="modal-footer">
            <button data-dismiss="modal" class="btn btn-default" type="button">Close</button>
            <button class="btn btn-primary" type="button"  onClick="updateToFullVersion();">Confirm</button>
        </div>
    </div>
</div>

X
升级到完整版本
卡片上的名字
卡号
邮政编码
CVC
到期
接近
证实

Idk为什么我在“卡片上的姓名”下有一行，而“模式页脚”不起作用。有人知道为什么会这样吗

---

谢谢你没有平衡你的标签。尝试关闭输入以开始

这样做：

<input class='form-control' id="CustomerCreditCardExpirationYear" placeholder='YY' size='2' type='text' />

---

注意用“

/>

”

结束时，我关闭了输入，但仍然是相同的问题它看起来肯定像是一个不平衡的html（第一个字段上方的行似乎与标题本身混淆）。让我再检查一遍。我同意，但我找不到导致问题的原因检查

是否也有结束标记（可能是最外面的标记）。我发现了问题。我得换一个。我不知道为什么