我有一个模态,如下所示:
模态必须足够大,以使第一个文本字段和检查按钮彼此相邻,第二个文本字段和复选按钮彼此相邻。我试图增加模态的高度和宽度,但成功地只增加了宽度。当尝试自定义模态大小时,高度变小。使用modal-lg
具有相同的效果。我的代码如下:
<div id="addQueue" class="modal fade" role="dialog">
<div class="modal-dialog addqueue-modal">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add a Queue to your Desk</h4>
</div>
<div class="modal-body">
<form role="form">
<div class="form-group">
<div class="col-sm-7">
<label for="queuename">Name your Queue: </label>
<input type="text" class="form-control" id="queuename">
</div>
<div class="checkbox">
<label><input type="checkbox" value="closedqueue">Create a Closed Queue; Open when ready</label>
</div>
</div>
<div class="form-group">
<div class="col-md-7">
<label for="queueinfo">Additional information about the Queue: </label>
<input type="text" class="form-control" id="queueinfo">
</div>
<span class="checkbox">
<label><input type="checkbox" value="tooltipdisplay">Display as tooltip when hovering over the Queue</label>
</span>
</div>
<hr>
</form>
</div>
</div>
</div>
</div>
相关的CSS如下:
.addqueue-modal{
width: 1000px;
max-height: 1000px;
}
有谁知道如何修复我的模态,让我的文本字段和复选框与前面描述的相同?提前谢谢!
答案 0 :(得分:0)
试试这个
.addqueue-modal{
width: 1000px;
max-height: 1000px;
overflow-y: auto;
}