title: left-div | center-div | right-div, everyone vertical-aligned
body: <p>I'm trying to obtain this three-columns layout:</p>
  
  <p><img src="https://s30.postimg.org/48nyr2voh/header.png" alt="my layout"></p>
  
  <ol>
  <li><code>div1</code> (green) with its content aligned <strong>to the left</strong></li>
  <li><code>div2</code>  (blue) with its content aligned <strong>to the center</strong></li>
  <li><code>div3</code> (magenta) with content its aligned <strong>to the right</strong></li>
  </ol>
  
  <p>Inside each column, I've multiple block element ("sheeps" in my mockup). Each element must be vertical-aligned to the "absolute" middle, no matter it's size: as the red-dotted line displays (more or less...), I need all the contained elements to have their <strong>center on the same line</strong>.</p>
  
  <p>I'm starting from scratch, but <strong>I cannot use any "fixed" dimensions</strong>.</p>
  
  <p>Thanks for your help.</p>
  
  <p>Edit: My non-working crap is here <a href="http://jsfiddle.net/gV99f/6/" rel="nofollow noreferrer">http://jsfiddle.net/gV99f/6/</a></p>