引导程序模态车身高度不变

时间:2019-02-25 13:59:33

标签: html css twitter-bootstrap bootstrap-4 modal-dialog

我正在尝试增加单个模式的高度。

我已经向div添加了height属性,如下所示:

    <div class="modal fade" id="RTWmodal" role="dialog" style="margin-top: 20px;">
    <div role="document" class="modal-dialog modal-lg" style='height:1000px;'>
    <div class="modal-content modal-tall" style='height:1000px;'>
    <div class="modal-body" style='height:1000px;'>

这会增加整体模态,但是模态的主体通过滚动条保持在设定的高度吗?见下文:

enter image description here

我在这里不做什么?

更新-完整模式代码

<div class="modal fade" id="RTWmodal" role="dialog" style="margin-top: 20px;">
<div role="document" class="modal-dialog modal-lg" style='height:1000px;'>
<div class="modal-content modal-tall" style='height:1000px;'>

<div class="modal-body" style='height:1000px;'>
<h4 id="myPanelModalLabel" class="modal-title">Right to work </h4>

<hr>   

    *CONTENT*



</div>
</div>
 </div>
</div>  

2 个答案:

答案 0 :(得分:2)

这应该做

.modal-tall .modal-body 
{
 position: relative;
 min-height: 600px;
 padding: 15px;
} 

答案 1 :(得分:1)

创建一个新的模态类modal-tall

.modal-tall .modal-body 
{
 position: relative;
 min-height: 600px;
 padding: 15px;
} 

像这样使用:

 <div class="modal tall fade" id="RTWmodal" role="dialog" style="margin-top: 20px;">
    <div role="document" class="modal-dialog modal-lg">
    <div class="modal-content modal-tall" >