This is covered in the official documentation:
Modal markup placement
Always try to place a modal's HTML code in a top-level position in your document to avoid other components affecting the modal's appearance and/or functionality.
Put the <div>
that has the modal
class outside of the navbar. You can leave the modal-triggering <a>
in the navbar.