title: Fill remaining space between two inline-blocks with another inline-block
body: <p>I have 3 divs. Each of them is an inline-block. The left one floats left. The right one floats right. The middle one floats right too. The outer divs have fixed widths. What I want to do is, that the middle div fills the whole space between the other divs. I can't specify a width, because it should work with every width of the screen. Here's the code.</p>
  
  <pre><code>&lt;div id="wrapper"&gt;
      &lt;div id="right"&gt;&lt;/div&gt;
      &lt;div id="middle"&gt;&lt;/div&gt;
      &lt;div id="left"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  #wrapper {
      width: 100%;
  }
  #left {
      float: left;
      width: 50px;
  }
  #right {
      float: right;
      width: 50px;
  }
  #middle {
      float: right;
  }
  </code></pre>