title: HTML/CSS Making 3 divs line up next to each other with one with flexible width
body: <p>I'm trying to align 3 divs next to each other, with 2 flexible width and 1 fixed width.
  Please see the following jsfiddle:
  <a href="http://jsfiddle.net/qyGC5/82/" rel="nofollow noreferrer">http://jsfiddle.net/qyGC5/82/</a></p>
  
  <p>I've seen this post: <a href="https://stackoverflow.com/questions/6826542/three-divs-next-to-each-other-with-fluid-horizontal-width">Three DIVs next to each other with fluid horizontal width</a>
  but it doesn't work with 2 flexible divs or even with just 1 flexible width (the one with the long text). <a href="http://jsfiddle.net/qyGC5/89/" rel="nofollow noreferrer">http://jsfiddle.net/qyGC5/89/</a></p>
  
  <p>I also though of percentages, but since using 100% is out of the question, the gap would get bigger or smaller on resize.</p>
  
  <p>Any help, much appreciated.
  Thanks.</p>
  
  <p><strong>EDITED</strong>
  Adding some screen shots to show what happens after I ajax load new comments (this is to display comments)</p>
  
  <p>BEFORE THE AJAX LOAD MORE COMMENTS
  <img src="https://i.stack.imgur.com/ZAgwc.png" alt="This is before the AJAX load, looks perfect"></p>
  
  <p>AFTER THE AJAX LOAD
  <img src="https://i.stack.imgur.com/S8aHO.png" alt="enter image description here"></p>