jquery - How do I remove the white area in Bootstrap 3's external modal -

i'm using boostrap 3.2.0's remote modal, makes kind of white window in background - how can remove it?

modal.html:

<a data-toggle="modal" href="modal-content.html" data-target="#mymodal">modal popup</a> <div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true">     <div class="modal-dialog">         <div class="modal-content">             <!-- // -->         </div>     </div> </div> 

modal-content.html:

<div class="modal-dialog">     <div class="modal-content">         <div class="modal-header">             <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>             <h4 class="modal-title">my modal preview</h4>         </div>         <div class="modal-body">             <p>some external content here.</p>         </div>         <div class="modal-footer">             <button type="button" class="btn btn-default" data-dismiss="modal">close</button>         </div>     </div> </div> 

screenshot:

you have modal inside modal, try:

<!-- modal.html: --> <a data-toggle="modal" href="modal-content.html" data-target="#mymodal">modal popup</a>     <div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true">       <div class="modal-dialog">         <div class="modal-content">                     <!-- // -->         </div>      </div> </div>   <!-- modal-content.html: --> <div class="modal-header">     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>     <h4 class="modal-title">my modal preview</h4> </div> <div class="modal-body">     <p>some external content here.</p> </div> <div class="modal-footer">     <button type="button" class="btn btn-default" data-dismiss="modal">close</button> </div>