Twitter bootstrap 将模态页脚移动到模态的底部

我一直在尝试使用Vue、js和Bootstrap制作一些模态，但是页脚不会进入模态的底部

如何将页脚移动到模型的底部

<div class="modal-mask" transition="modal">
    <div class="modal-wrapper">
        <div class="modal-container">
            <div class="modal-header">
                <button type="button" data-dismiss="modal" aria-hidden="true" class="close">×</button>
                <h4 class="modal-title">Edit Report</h4>
            </div>
            <form role="form" class="form-horizontal">
                <input type="hidden" name="_method" value="PATCH">
                <div class="modal-body">
                    <div class="row">
                        <div class="form-group">
                            <label for="report_type_id" class="col-sm-1 control-label">Type</label>
                            <div class="col-sm-4">
                                <select id="report_type_id" class="form-control">
                                    <option disabled="disabled" value="">Please select one</option>
                                    <option value="1"> datatable</option>
                                    <option value="2">jasper</option>
                                </select>
                            </div>
                            <label for="inputArea" class="col-sm-1 control-label">Area</label>
                            <div class="col-sm-4"><select id="inputArea" class="form-control">
                                <option disabled="disabled" value="">Please select one</option>
                                <option value="2">salesadmin</option>
                                <option value="1">utilitytest</option>
                            </select>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group">
                            <div class="col-sm-12">
                                <div class="form-group"><label for="inputTitle"
                                                               class="col-sm-1 control-label">Name</label>
                                    <div class="col-sm-4"><input type="text" id="inputTitle" required="required"
                                                                 class="form-control"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div>
                        File Upload
                    </div>
                </div>
            </form>
            <div class="modal-footer">
                <button type="button" class="btn btn-default">Cancel</button>
                <button type="button" class="btn btn-primary">Save</button>
            </div>
        </div>
    </div>
</div>

×
编辑报告
类型
请选择一个
数据表
贾斯珀
地区
请选择一个
销售管理员
效用测试
名称
文件上传
取消
拯救

更新了

的CSS。模态体

分类和设置

最小高度：300px

.modal-body {
    margin: 20px 0;
    min-height:300px;
}

---

更新了

的CSS。模态体
分类和设置
最小高度：300px

.modal-body {
    margin: 20px 0;
    min-height:300px;
}

如果移除
。模态容器
类
高度：500px
则模态调整其高度，并在模态底部显示
取消
和
保存
按钮。是的，可以，但是如何在不弄乱页脚位置的情况下指定大小？为class
指定属性
min height:300px
。modal body
。如果您删除
。模态容器
类
高度：500px
然后模态调整其高度，并在模态底部显示
取消
和
保存
按钮，我希望这会起作用。是的，这很有效，但是如何在不弄乱页脚位置的情况下指定大小？为class
指定属性
min height:300px
。modal body
。我希望这能奏效