I have come across similar questions addressing the need to change the following:
.modal-backdrop {
display: none;
}
However, my modal does not have this .modal-backdrop. I am unsure if this is a new feature in Bootstrap 4, but the mentioned solution did not work for me.
Here is my modal code:
<div class="modal" data-keyboard="false" data-backdrop="false" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white" id="header" style="cursor: move">
Search
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form id="forms">
</form>
<hr>
<div class="container" id="table">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary">Export</button>
</div>
</div>
</div>
</div>
I am looking to create a draggable dialog window and I used modal for its central positioning and easy setup of the close button without additional JavaScript. Is modal the correct component for this task, or should I consider using cards?
I am also open to suggestions for external libraries that offer panel-like modules that integrate well with Bootstrap.
Lastly, I am wondering if there is a way to enable the background without making significant changes to the Bootstrap files. Any recommendations?