title: Set modal layer to the center fo the viewed screen
body: <p>I'm using <a href="http://getbootstrap.com/2.3.2/javascript.html#modals" rel="noreferrer">Twitter Bootstrap's modal</a>, but I had to change their position to absolute, be cause I need them to be able to scroll cause of the small screens. Sadly, with this, the modals open to a fixed position of the site and not on the viewed area. 
  Is there any way to open them (and be able to be scrolled) to the screen what I'm currently viewing?</p>
  
  <p><img src="https://i.stack.imgur.com/VMdS3.jpg" alt="Picture of my problem"></p>
  
  <p>CSS:</p>
  
  <pre><code>.modal {
      width: 845px;
      margin: -250px 0 0 -430px;
      background-color: #f6f5ed;
      position: absolute;
      border: 1px solid #cdc4b2;
      top: 50%;
      left: 50%;
  }
  </code></pre>