title: Positioning an element at the bottom of div (not parent) - Twitter Bootstrap v3
body: <p>I'm trying to positioning an element (button) at the bottom of a div, please check my code to understand exactly that I want to achieve:</p>
  
  <pre><code>&lt;body&gt;
      ...
      &lt;div class="row"&gt;
          &lt;div class='col-md-3&gt;
              ...
          &lt;/div&gt;
          &lt;div class='col-md-4 narrow'&gt;
              &lt;div class='row'&gt;
                  &lt;div class='col-md-4'&gt;
                      ...
                  &lt;/div&gt;
                  &lt;div class='col-md-4'&gt;
                      ...
                  &lt;/div&gt;
                  &lt;div class='col-md-4'&gt;
                      ...
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class='row'&gt;
                  &lt;div class='col-md-12'&gt;
                      &lt;a href="#"&gt;
                          &lt;button&gt;I'M THE ELEMENT!&lt;/button&gt;
                      &lt;/a&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class='col-md-5'&gt;
              ...
          &lt;/div&gt;
      &lt;/div&gt;
      ...
  &lt;/body&gt;
  </code></pre>
  
  <p>I can't set <code>position:absolute</code>, because that breaks the visual style of my project. </p>
  
  <p>Look this image that I have prepared:</p>
  
  <p><a href="https://i.stack.imgur.com/t19W7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/t19W7.png" alt="Layout"></a>
  </p>
  
  <p><strong>NOTE:</strong> The blue columns have variable height... For that reason I want to positionting the button at the bottom of those columns. How can I achieve that?</p>