Is it possible to make this layout without using javascript hacks?

Question

css

At work, a problem arose that I tried to solve without using JS, but alas, it did not work out.
jsfiddle.net/teMFs/1/ is an example of what I did.
The bottom line is that the central area with the content should be centered vertically. To do this, I applied a flexbox layout, but it needs the container to be 100% height as well. Problems add a block with buttons, which should be attached to the bottom of the page. Alas, the height of this block is not fixed, so doing it as usual does not work. Is it possible to do all this with just CSS?
The task is only for webkits, that is, cross-browser support is especially inappropriate. My example should work in opera and firelis. Theoretically in IE10.

Answer 1

And why 100% height is not suitable? You from height of viewport-a are repelled? Here is an example for webkit: mask/fiddle (see css tab)

Answer 2

A table with a height of 100% in the layout, which is designed according to the principles described in habrahabr.ru/post/151320/ .

Answer 3

Something like this:
jsfiddle.net/sgospodarets/QWb4H/4/