Click on Static Modal Backdrop Scaling up the Modal Content and Adding Scrollbar to Backdrop

[Behseini]

Using Bootstrap 4.4.1, I am facing an issue on clicking outside of static backdrop modal. As you can see in attached image when clicking outside of modal it is scaling up the size of Modal Content and eventually adding scrollbar to the backdrop. I have test this on Chrome and Firefox and same issue is happening. Can you please let me know how to stop this?
Here is the image link

` <div class="container p-5">
  <!-- Button trigger modal -->
  <button type="button" class="btn btn-primary" data-toggle="modal" data- 
    target="#staticBackdrop">
   Launch static backdrop modal
  </button>
  <!-- Modal -->
 <div class="modal fade" id="staticBackdrop" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="staticBackdropLabel" aria-hidden="true">
 <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
 <div class="modal-content">
  <div class="modal-header">
    <h5 class="modal-title" id="staticBackdropLabel">Modal title</h5>
    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
    ...
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary">Understood</button>
  </div>
  </div>
 </div>
   </div>
     </div>`

[Behseini]

I find a fix on Stackoverflow which is working

.modal.modal-static .modal-dialog { -webkit-transform: none !important; transform: none !important; }

[ysds]

demo: https://codepen.io/fellows3/pen/gOpRebZ