title: Two div next to each other, with full width
body: <p>I want to do the following:</p>
  
  <p>column A, be as width as the maximum listitem | column B, be as width as place left, with having horizontal scrollbox when overleaps.</p>
  
  <p>WIDTH:auto | WIDTH: 100%;</p>
  
  <pre><code>list1   | adklajd lkasjdlk ajs kldajlkjd kalsd 
  list222 | sdfsf
  list33  | sdfsdffds
          | xxx
  </code></pre>
  
  <p>how to do this? Its not even easy.</p>
  
  <p>EDIT: <a href="http://jsfiddle.net/Y3p9F/" rel="nofollow">http://jsfiddle.net/Y3p9F/</a>
  and column B goes to new line, I dont want it</p>