Text expands upwards

Text expands upwards

by Nirvanachain

HTML

<div id="parent">
  <div class="to_bottom">
    <h1>Header</h1>
    <p>Content 1</p>
    <p>Content 2</p>
  </div>
</div>

<div id="parent">
  <div class="to_bottom">
    <h1>Header</h1>
    <p>Content 1</p>
    <p>Content 2 - some extra stuf here to see how it's going to handle it</p>
  </div>
</div>

CSS

#parent { 
    position: relative; 
    width:100px;
    height:300px;
    border: 1px dashed black;
    float:left;
    margin-right:20px;
}

.to_bottom { 
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border:1px solid black;
}