title: Make left div take up remaining width without swapping elements
body: <p>I have 2 divs side-by-side. The right div has a fixed width. The left div should fill the remaining space even as the window is resized. Example:</p>
  
  <pre><code>+---------------------------------+  +---------------+
  |                                 |  |               |
  |             divLeft             |  |    divRight   |
  |       &lt;- dynamic width -&gt;       |  |     120px     |
  |                                 |  |               |
  +---------------------------------+  +---------------+
  
  &lt;div&gt;
      &lt;div id="divLeft"&gt;...&lt;/div&gt;
      &lt;div id="divRight"&gt;...&lt;/div&gt;
  &lt;div&gt;
  </code></pre>
  
  <p>There's <a href="https://stackoverflow.com/questions/8094787/fixed-width-div-on-right-fill-remaining-width-div-on-left">a solution that uses float:right on the right element</a> but it requires reordering the elements like this:</p>
  
  <pre><code>&lt;div&gt;
      &lt;div id="divRight" style="float: right; width: 120px;"&gt;...&lt;/div&gt;
      &lt;div id="divLeft"&gt;...&lt;/div&gt;
  &lt;div&gt;
  </code></pre>
  
  <p>Is there a solution that does not require reordering the elements? I'm in a situation where reordering them will cause other problems. I'd prefer a CSS/HTML solution to this but I am open to using Javascript/JQuery.</p>
  
  <p>Here's a non-working <a href="http://jsfiddle.net/NmrbP/" rel="nofollow noreferrer">JSFiddle</a> of my attempt to solve it. I'm trying to position the blue div to the right of the green div.</p>