This is the padding for my body content.
https://i.sstatic.net/LG7IE.png
<div class="modal fade" id="exampleModal2" tabindex="-1" aria-labelledby="exampleModal2Label" aria-hidden="true" style="padding:0;">
<div class="modal-dialog modal-lg">
<div class="modal-content" >
<div class="modal-header">
<label class="modal-title" id="exampleModal2Label" style="font-weight: 700">Cancel An Order</label>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body" >
<panel ID="Panel1" >
<label class="form-label">Are you sure you want to cancel this order?</label>
<div>
<button type="button" class="btn btn-outline-danger btn-lg" data-bs-dismiss="modal" style="margin-top: 10px;font-size:x-small;border: none;color: black;">Close</button>
<button ID="btn_confirmCancel" class="btn btn-outline-primary btn-lg" data-bs-dismiss="modal" style="margin-top: 10px;font-size:x-small;margin-right: 30px;border: none;color: #14a2ad;" @onclick="cancelOrder">Confirm</button>
</div>
</panel>
</div>
</div>
</div>
</div>
this code belongs to me.
when I interact with this pop-up
my body padding on the right changes
https://i.sstatic.net/FKbrR.png
what could be a solution for this problem?