Testing element to bottom of screen

Trying to get a dropdown to stop at the bottom of the screen and go no further, but keep `top: auto;`. After accomplishing this, `overflow: scroll;` can be added. Trying to accomplish this without Javascript, no luck so far.

by thirdender

HTML

<script src="http://fonts.googleapis.com/css?family=Ubuntu"></script>
<ul class="menu">
   <li>
       <a href="#">Dropdown</a>
       <ul>
           <li><a href="#">Option #0</a></li>
           <li><a href="#">Option #1</a></li>
           <li><a href="#">Option #2</a></li>
           <li><a href="#">Option #3</a></li>
           <li><a href="#">Option #4</a></li>
           <li><a href="#">Option #5</a></li>
           <li><a href="#">Option #6</a></li>
           <li><a href="#">Option #7</a></li>
           <li><a href="#">Option #8</a></li>
           <li><a href="#">Option #9</a></li>
           <li><a href="#">Option #10</a></li>
           <li><a href="#">Option #11</a></li>
           <li><a href="#">Option #12</a></li>
           <li><a href="#">Option #13</a></li>
           <li><a href="#">Option #14</a></li>
           <li><a href="#">Option #15</a></li>
           <li><a href="#">Option #16</a></li>
           <li><a href="#">Option #17</a></li>
           <li><a href="#">Option #18</a></li>
           <li><a href="#">Option #19</a></li>
           <li><a href="#">Option #20</a></li>
           <li><a href="#">Option #21</a></li>
           <li><a href="#">Option #22</a></li>
           <li><a href="#">Option #23</a></li>
           <li><a href="#">Option #24</a></li>
           <li><a href="#">Option #25</a></li>
           <li><a href="#">Option #26</a></li>
           <li><a href="#">Option #27</a></li>
       </ul>
    </li>
</ul>

SCSS

body {
    font: 12px Ubuntu, Arial, sans-serif;
}
ul.menu {
    margin: 1em 0;
    padding: .4em 1em;
    border: 1px solid #ccc;
    border-width: 1px 0;
    background: #f5f5f5;
    box-shadow: 0 1px 0 white inset, 0 -1px 1px white;
    ul {
        position: absolute;
        bottom: 0;
    }
}