bootstrap3模态窗在浏览器中定位问题

向css中加入如下：

/*******模态窗口新增加居中效果******/
.modal { 
 width: 100%; 
 position: fixed; 
 margin: 0px auto; 
 top: 0px; left: 0px; 
 bottom: 0px; 
 right: 0px; 
 z-index: 1111050; 
 } 
 .modal_wrapper { 
 display: table; 
 overflow: auto; 
 overflow-y: scroll; 
 height: 100%; 
 -webkit-overflow-scrolling: touch; 
 outline: 0; 
 margin: 0px auto; 
 } 
 /*******end--模态窗口新增加居中效果******/

}

同时在html中加入：

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal_wrapper">  

<div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>

</div>
</div>

设置模态窗口宽度：

#modal_password_dialog {
width:560px;
height:220px;
}
#modal_password_content {
width:560px;
height:220px;
}

二者宽度需保持一致