title: CSS: two, divs side-by-side
body: <p>How can I make the green/yellow box be displayed next to the sidebar instead of below it?
  The green/yellow part should be 100% width.</p>
  
  <p><img src="https://i.stack.imgur.com/SODDr.png" alt="Screensho"></p>
  
  <p>Here is my sourcecode:
  <strong>HTML</strong></p>
  
  <pre><code>    &lt;div id="sidebar"&gt;
  
      &lt;/div&gt;
  
      &lt;div class="header"&gt;
  
      &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>#sidebar{
      background-color: #404040;
      height: 100%;
      width: 50px;
  }
  
  .header{
      margin-left: 50px;
      width: 100%;
      height: 200px;
      background-color: #808000;
  }
  </code></pre>