title: extending width of floated div
body: <p>Given two floated divs whose width takes 50% of their container when aligned side by side, is it possible to have their width extend all the way to 100% when the screen is shrunk to the point where the second div has to be pushed one row down?</p>
  
  <p>Take the following <a href="http://codepen.io/anon/pen/ZGMgJL" rel="nofollow">codepen</a> for example, and shrink the window horizontally until the green div and its container move below the red one. Is it possible to have the width of <code>#wrap1</code> and <code>#wrap2</code> extend all the way to the right of <code>#container</code>, so that <code>#one</code> and <code>#two</code> are centered with respect to <code>#container</code>? i.e. so it would look like <a href="http://codepen.io/anon/pen/pJOMaE" rel="nofollow">this</a>.  </p>