Can I use two overflow properties?

Question

I am using Bootstrap and Select2.

I have encountered the unclickable search box error on Select2 which I fixed by adding overflow: visible on my modal.

<div class="modal fade" id="myModal1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true" style="overflow:visible">

But this caused my modal to be unscrollable. Changing it to overflow:scroll caused the previous Select2 error to re-appear.

How do I go about this? Can I use two overflow properties?

Never used Select2, but this sounds promising (since no example is present) - https://select2.org/dropdown#dropdown-placement — Rob Scott, May 08 '19 at 03:24

score 0 · Accepted Answer · answered May 08 '19 at 11:15

After digging Google for the solution that might work for me, finally I found the real answer from here in pymarco's answer. You have to add below code to your $(document).ready(function() { });

$.fn.modal.Constructor.prototype.enforceFocus = function () {};

This made the Select2 search and the modal scrolling both working.

Can I use two overflow properties?

1 Answers1