Modals are built with HTML, CSS, and JavaScript. They're positioned over everything else in the document and remove scroll from the 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 documentation.