title: Vertically center, right align, multi-line text in absolutely positioned div with flexbox parent
body: <p>I have a some absolutely positioned divs with two lines of text, an h2 and a p.  I'm trying to get the text to be: centered vertically within the absolutely positioned div, right aligned, and there be a linebreak between the h2 and p tag.</p>
  
  <p>The absolutely positioned divs are contained within a parent so I thought I could use flexbox to solve this problem, but turns out it's harder than expected.  I've given the parent display:flex and align-items:center which vertically centers them.  But then my h2 and p are on the same line, there's no linebreak.  </p>
  
  <p>So then I used flex-direction: column which created a linebreak, but then the text is no longer centered vertically.  If I use align-items:flex-end and flex-direction:column the text will be right aligned and there will be a linebreak between the h2 and p, but then they are not centered vertically. </p>
  
  <p>margin-right:auto can supposedly right align items, but combined with align-items:center and flex-direction:column, it doesn't work.  float:right also doesn't work.  </p>
  
  <p>My markup looks like this:</p>
  
  <pre><code>    &lt;div class = "col-sm-12"&gt;
        &lt;div class = "row overlay-container"&gt;
          &lt;img src = "_img/top-right@4x.png" class = "img-responsive grid-image" alt = "top-right@4x image" /&gt;
            &lt;div class = "overlay overlay-2"&gt;
             &lt;h2&gt;Recent Work&lt;/h2&gt;
             &lt;p&gt;Lorem ipsum dolor&lt;/p&gt;
           &lt;/div&gt; &lt;!-- /overlay --&gt;
        &lt;/div&gt; &lt;!-- /row --&gt;
      &lt;/div&gt; &lt;!-- /top right --&gt;
  </code></pre>
  
  <p>where overlay is the absolutely positioned div inside the overlay-container. The overlay is a box positioned over a portion of the image. The display:flex and other properties mentioned above are on the overlay class.</p>
  
  <p>It seems that no matter what I try, I can only get two out of the three conditions to work.  Using flexbox is not a requirement, but I thought it would make it easy to vertically center the text. Can anyone help?</p>