<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div> <a class="btn btn-primary" role="button" href="#model-id" data-toggle="modal">Button</a>  <br/></div> <div tabindex="-1" class="modal fade" id="model-id" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button class="close" aria-hidden="true" type="button" data-dismiss="modal">×</button> <h3>Heading</h3> </div> <div class="modal-body"> Content </div> <div class="modal-footer"> <button class="btn" aria-hidden="true" data-dismiss="modal">Close</button><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/></div> </div> </div> </div>