Is there a way to adjust the width of my ngx bootstrap modal so that it is not fixed? I have attempted to modify it in the HTML code below but without success:
Here's the HTML snippet:
<div bsModal #childModal="bs-modal" class="modal fade" tabindex="-1"
role="dialog" [config]="{backdrop: 'static'}" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-body text-center">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close" (click)="hide()"><span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Are you sure?</h4>
<div class="modal-footer">
<div class="col-xs-6 no-padding-left">
<button type="button" id="dialog_no" class="btn btn-
default btn-block" data-dismiss="modal" (click)="hide()">No</button>
</div>
<div class="col-xs-6 no-padding-right">
<button type="button" id="dialog_yes" class="btn btn-
primary btn-block ladda-button" data-style="expand-right"
(click)="confirm()">Yes</button>
</div>
</div>
</div>
</div>
</div>
</div>
My question is, how can I adjust the width of the modal in order for the buttons to be aligned at the edge with a 5px margin?
https://i.sstatic.net/bm8ff.png
I have not applied any custom styling in my CSS file yet, and despite attempting to change the width, I am still unsure how to achieve the desired result...