title: CSS alternative for display:box for IE and Opera?
body: <p>I am using display:box for a flexible width div with three boxes of equal size and with equal spacing.  This works fine for Firefox, Safari and Chrome, but not in IE and Opera.  I am wondering what the best alternative method for IE and Opera would be.  Here is the display:box CSS: </p>
  
  <pre><code>.box {
      display: -moz-box;
      display: -webkit-box;
      display: box;
      width: 100%;
  }
  
  .box1, .box2, .box3 {
      -moz-box-flex: 1;
      -webkit-box-flex: 1;
      box-flex: 1;
      width: 0;
  }
  
  .box2, .box3 {  
      margin-left: 20px;
  }
  </code></pre>
  
  <p>And the HTML:</p>
  
  <pre><code>&lt;div class="box"&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&gt;
  </code></pre>
  
  <p>You can see it in action <a href="http://www.bodhitreebrighton.org.uk/about.html">here</a>.</p>
  
  <p>I'd be glad to hear of an alternative method for achieving a similar result in IE and Opera.</p>
  
  <p>Thanks,</p>
  
  <p>Nick</p>