title: How to simulate 'position:fixed' behavior on Flexbox-aligned sidebar
body: <p>As it was already answered (<a href="https://stackoverflow.com/questions/29036231/how-can-i-have-a-position-fixed-behaviour-for-a-flexbox-sized-element">How can I have a position: fixed; behaviour for a flexbox sized element?</a>) absolutely/fixed positioned boxes are taken out of the normal flow of Flexbox-aligned elements. But how can I at least simulate <code>position: fixed</code> behavior of, say, <code>width: 300px; height: 100vw</code> element?</p>
  
  <p>Here is a demo (<a href="http://codepen.io/anon/pen/ZGmmzR" rel="noreferrer">http://codepen.io/anon/pen/ZGmmzR</a>) of initial layout with sidebar on the left and content block on the right. I would like <code>nav</code> act like <code>position: fixed</code> element following user's scroll across the page. I know how to do it without Flexbox. In the first place I would consider pure CSS solution without using JavaScript. Thank you!</p>