Vertical alignment with Pure CSS (from YUI)

Question

How to add elements vertical-align: middleto elements using PureCSS, from YUI ?

I have three elements with the same height, and I want them to have “inside” vertical-align: middle.

=> Check jsfiddle: http://jsfiddle.net/kn88b/1/

The closest I got with display: table; width: 100%, but this is the ERROR of the "mobile version", so I want a solution for all versions (tablet / desktop / mobile).

Answer 1

Use flexboxes! Here is the JSFiddle I tested in Chrome.

http://jsfiddle.net/kn88b/6/

I pointed display: flexto .a,.b,.cand pointed margin: autoto.inside

-, , .

flexboxes : http://coding.smashingmagazine.com/2013/05/22/centering-elements-with-flexbox/

Answer 2

: http://jsfiddle.net/kn88b/3/. display:table display:table-cell; vertical-align:middle;