title: How to put some divs in a row?
body: <p>I'm trying to put two divs without a linebreak between them.</p>
  
  <p>this is the html:</p>
  
  <pre><code>        &lt;div id="header"&gt;
              &lt;div id="logo"&gt;&lt;/div&gt;
  
              &lt;div id="left"&gt;
                  &lt;div id="slideshow"&gt;&lt;/div&gt;
              &lt;/div&gt;
  
          &lt;/div&gt;
  </code></pre>
  
  <p>and this is the CSS:</p>
  
  <pre><code>    #header {
      background-color: #13768a;
      width: 962px;
      height: 207px;
      margin-right: auto;
      margin-left: auto;
      clear: both;
  }
  
  
  #logo {
      background-image:url('logo.png');
      height: 207px;
      width: 250px;
      margin-right: 0px;
      padding: 0px;
      }
  
      #left {
      width:712px;
      height: 207px;
  }
  
  #slideshow {
      background-color: #137387;
      width: 686px;
      height: 144px;
      margin-right: auto;
      margin-left: auto;
  }
  </code></pre>
  
  <p>the problem is that I want it to look like this:
  <a href="http://img405.imageshack.us/img405/8357/indexrecovered.png" rel="nofollow">How I want it to look like</a></p>
  
  <p>But it looks like this:
  <a href="http://img440.imageshack.us/img440/6053/77002607.png" rel="nofollow">How it looks like</a></p>