html - 模态上的滚动条在Firefox和IE中不起作用

我有一个带有滚动条的模态，它在Firefox和IE中不起作用，并且在chrome和Opera浏览器中工作正常

[小提琴] [1]

     [1]: https://jsfiddle.net/nb9g2hj2/

最佳答案

您定义了max-height: 60%;，但要精确定义父级高度的60％，就像这样对它使用固定高度

.modelheight1 {
	overflow-y: scroll;
  max-height: 100px;
  margin-top: 20px;
  margin-bottom: 20px;
}

<!-----Terms and Condition Modal----->

                <div class="modal fade" id="termsModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <!--<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>-->
        <h4 class="modal-title" id="myModalLabel">Terms and Conditions</h4>
      </div>
      <div class="modal-body modelheight1" id="modalBody1">
        <p style="text-align:justify;" id="modalTerms">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum non ipsum at magna finibus rhoncus a vitae leo. Phasellus id nibh luctus, gravida elit pellentesque, consectetur sem. Nulla fringilla, nulla et egestas rhoncus, sem risus iaculis neque, eget aliquam mauris erat vitae nulla. Vivamus placerat est lectus, ac molestie orci tincidunt a. Aliquam ac viverra sapien, sed vestibulum ex. Fusce malesuada ut arcu at porttitor. Cras suscipit leo vel varius venenatis. Nullam aliquam non elit a lacinia.

Morbi vulputate, purus in dictum luctus, urna sapien auctor neque, at venenatis turpis justo nec neque. Etiam a tortor turpis. Quisque auctor nec neque sed viverra. Maecenas sit amet nisl risus. Aenean ut felis eu diam vehicula porttitor. Donec eget nunc est. Nunc porttitor felis sem, eu tristique erat auctor et. Donec sed magna nunc. Nulla pretium orci quis sem dictum volutpat.

Morbi vulputate, purus in dictum luctus, urna sapien auctor neque, at venenatis turpis justo nec neque. Etiam a tortor turpis. Quisque auctor nec neque sed viverra. Maecenas sit amet nisl risus. Aenean ut felis eu diam vehicula porttitor. Donec eget nunc est. Nunc porttitor felis sem, eu tristique erat auctor et. Donec sed magna nunc. Nulla pretium orci quis sem dictum volutpat.

Morbi vulputate, purus in dictum luctus, urna sapien auctor neque, at venenatis turpis justo nec neque. Etiam a tortor turpis. Quisque auctor nec neque sed viverra. Maecenas sit amet nisl risus. Aenean ut felis eu diam vehicula porttitor. Donec eget nunc est. Nunc porttitor felis sem, eu tristique erat auctor et. Donec sed magna nunc. Nulla pretium orci quis sem dictum volutpat.
</p>
      </div>
      <div class="modal-footer">
        <!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
        <button class="btn btn-primary" data-dismiss="modal" disabled aria-hidden="true" id="agreeBtn">Agree</button>
      </div>
    </div>
  </div>
</div>
                <!-----End T&C Modal----->

https://jsfiddle.net/nb9g2hj2/1/

关于html - 模态上的滚动条在Firefox和IE中不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50228640/