<div class=" " id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="false">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">
					<div class="modal-body">
						<button type="button" class="close push-xs-right" data-dismiss="modal" aria-label="Close">
							<i class="fa fa-close"></i>
						</button>
						<div class="container-fluid modal-item">

							all modal contents

						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="modal fade " id="exampleModalLong2" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="false">
			<div class="modal-dialog modal-lg">

			</div>
		</div>

						
How to use

First one is a static modal. Modals are hidden by default.

  • To embed in your page use .modal class (see second code example)
  • Be sure to set a unique id on the .modal for optional controls, especially if you’re using multiple Modal on a single page.
  • You can change the modal pop up window style and position using .modal-dialog class

Example

Static Modal

Working Modal