title: How to distribute div along all the width of a container?
body: <p>I'd like to have 'b' be equally distributed along 'a' like this :</p>
  
  <pre><code>[1        2         3        4]
  </code></pre>
  
  <p>It would be nice that if there is not enough space, then 'a' block extends to the next line. Here is the html structure, I'd like, but its not fixed in stone and can be modified.</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;style&gt;
              .a { width: 100%; border: 1px solid; float: left; }
              .b {  width: 100px; border: 1px solid red; float: left;}
          &lt;/style&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div class'a'&gt;
              &lt;div class='b'&gt;1&lt;/div&gt;
              &lt;div class='b'&gt;2&lt;/div&gt;
              &lt;div class='b'&gt;3&lt;/div&gt;
              &lt;div class='b'&gt;4&lt;/div&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>