title: Fluid width with equally spaced DIVs
body: <p>I have a fluid width container DIV.</p>
  
  <p>Within this I have 4 DIVs all 300px x 250px...</p>
  
  <pre><code>&lt;div id="container"&gt;
     &lt;div class="box1"&gt; &lt;/div&gt;
     &lt;div class="box2"&gt; &lt;/div&gt;
     &lt;div class="box3"&gt; &lt;/div&gt;
     &lt;div class="box4"&gt; &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What I want to happen is box 1 to be floated left, box 4 to be floated right and box 2 and 3 to be spaced evenly between them.  I want the spacing to be fluid as well so as the browser is made smaller the space becomes smaller also.</p>
  
  <p><img src="https://i.stack.imgur.com/4nNte.jpg" alt="enter image description here"></p>