Semantic UI elements extending beyond modal

When an element is absolute positioned and goes over the modal edge, scrolling is not triggered unlike Bootstrap modal.

by lulalala

HTML

<link rel="stylesheet" href="https://semantic-ui.com/dist/semantic.css">
<script src="https://semantic-ui.com/dist/semantic.js"></script>
<div class="ui modal">
  <i class="close icon"></i>
  <div class="header">
    Absolute positioned long drop down select list
  </div>
  <div class="image content">
    <div class="description">
      <div class="scroll">
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      item<br/>
      </div>
    </div>
  </div>
  <div class="actions">
    <div class="ui black deny button">
      No
    </div>
    <div class="ui button">
      Yes
    </div>
  </div>
</div>

CSS

body {
    padding: 1em;
}

.scroll {
  //display: none;
  width: 200px;
  position: absolute;
  background-color: white;
  border: 1px solid black;
}

JavaScript

$('.ui.modal').modal({
  observeChanges: true
}).modal('show');