title: How to divide div into percentages but keep one constant width value div on left
body: <p>I have 4 boxes, I want box1 to have 50px width on the left, and the 3 remaining boxes must fill in the rest of screen, they should be resizable. How can I achieve this?</p>
  
  <p><strong><a href="http://jsfiddle.net/DBnSp/" rel="nofollow">http://jsfiddle.net/DBnSp/</a></strong></p>
  
  <pre class="lang-css prettyprint-override"><code>.box1
  {
      width: 50px;
      height: 100px;
      background: red;
      float: left;
  }
  
  .box2
  {
      width: 25%;
      height: 100px;
      background: yellow;
      float: left;
  }
  
  .box3
  {
      width: 25%;
      height: 100px;
      background: blue;
      float: left;
  }
  
  .box4
  {
      width: 25%;
      height: 100px;
      background: green;
      float: left;
  }
  </code></pre>