I am facing an issue in my code where adding the class m-0 to a button is not working to reduce the margin around it to 0. However, when I include .close {margin:0;} in my SCSS file, it successfully reduces the margin to 0. Even though I was advised against this and told to use the shortened bootstrap classes like m-0 and p-0, I am still encountering this problem. How can I resolve this issue with as minimal code as possible?
<h2 class="modal-title mx-auto mt-0">My text <br> Hi there </h2> <button type="button" class="close position-absolute m-0" data-dismiss="modal" aria-label="Close"> <i class="fas fa-times" style = "color: #2C757E;"></i> </button>