Modal Modal dialogs for lightboxes, user notifications, or completely custom content
body so that modal content scrolls instead. Bootstrap only supports one modal window at a time. Nested modals aren’t supported as it is believed to be poor user experiences. Modals use
position: fixed, which can sometimes be a bit particular about its rendering. Whenever possible, place your modal HTML in a top-level position to avoid potential interference from other elements. You’ll likely run into issues when nesting a .modal within another fixed element
Find in-depth, guidelines, tutorials and more on Bootstrap Modals's at the official bootstrap site.
.modal-dialog-topcan be placed on a
.modal-dialog. These side modals are compatible with the sizes classes.
Modifications for modals
.modal-fullscreen. Using the modifer class
.modal-backdrop-transparentmakes the backdrop transparent. You can also translate the modals to cast as an alert by using the modifier class
Transparent Modal (Tinted)
.modal-transparent. These modals are compatible with their respected size classes.