title: DIV fit width content in parent
body: <p>I have a list of object with slider - when clicking on right arrow, <i>left</i> param animates to i.e. -500px.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="container"&gt;
     &lt;div id="list"&gt;
        &lt;div class="elem"&gt;&lt;/div&gt;
        &lt;div class="elem"&gt;&lt;/div&gt;
        &lt;div class="elem"&gt;&lt;/div&gt;
        &lt;div class="elem"&gt;&lt;/div&gt;
        // more ...
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>styles</p>
  
  <pre><code>#container {
     width: 500px;
     overflow: hidden;
  }
  #list {
     position: relative;
     left: 0px;
  }
  .item {
     float: left;
  }
  </code></pre>
  
  <p>I want <code>#list</code> to fit its content - now it moves overflowed children to the next line.
  Setting <code>display: inline-block</code> would work but without parent with fixed width.</p>
  
  <p>How can i achieve this?</p>