Modal stackoverflow question

http://stackoverflow.com/questions/43478664/how-do-i-create-a-scrollable-dialog-box-popup-of-variable-height-as-an-overlay

by Augustus Yuan

HTML

<body>
 <div class="overlay">
  <div class="dialog-container">
    <div class="dialog">Hello World</div>
 
  </div>
  </div>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
 page<br>filler<br>page<br>filler<br>page<br>filler<br>
</body>

CSS

.overlay {
 position:fixed;
 z-index:9999;
 background-color:rgba(0,0,0,0.5);
 text-align:center;
 width:100%;
 height:100%;
 top:0px;
 left:0px;
}

.dialog {
 height:500px;
}

.dialog-container {
  posiiton: relative;
  width:50%;
  overflow-y: scroll;
  height: 200px;  
  margin:0;
  position:absolute;
  top:50%;
  left:50%;
  -ms-transform:translate(-50%, -50%);
  transform:translate(-50%, -50%);
  background:#fff;
}