Essential Italy Hide all

Modals

Modals
Modal title

Modal body text goes here.

<div class="modal position-static d-block" tabindex="-1"> 
    <div class="modal-dialog"> 
        <div class="modal-content"> 
            <div class="modal-header"> 
                <h5 class="modal-title">Modal title
                </h5> 
                <button type="button" class="btn btn-icon btn-close" data-bs-dismiss="modal" aria-label="Close">
                </button> 
            </div> 
            <div class="modal-body"> 
                <p>Modal body text goes here.
                </p> 
            </div> 
            <div class="modal-footer"> 
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close
                </button> 
                <button type="button" class="btn btn-primary">Save changes
                </button> 
            </div> 
        </div> 
    </div> 
</div>
Types 
// Centered modal 
<div class="modal-dialog modal-dialog-centered">...
</div> // Modal XL 
<div class="modal-dialog modal-xl">...
</div> // Modal LG 
<div class="modal-dialog modal-lg">...
</div> // Modal SM 
<div class="modal-dialog modal-sm">...
</div>