title: Absolute divs next to eachother
body: <p>In my html page i have two divs inside a container div. The two inner divs have a 'position: aboslute'. Becuase they have to be placed at the bottom left corner of the container div.</p>
  
  <p>This works great when the container div only has one inner div. But when i add a 2nd div, then the 2nd div is placed ontop of the first inner div. Which makes sense ofcourse. But now i'm trying to find a way to have them next to eachother instead of them overlapping eachother.</p>
  
  <p>The inner divs are generated. So i can't manually add an ID to them. All they have is one class name.</p>
  
  <p><a href="http://jsfiddle.net/sYGfq/" rel="noreferrer">Example</a>:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div class="icon"&gt;ICON1&lt;/div&gt;
      &lt;div class="icon"&gt;ICON2&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  
  
  <pre><code>#container {
      position: relative;
      width: 200px;
      height: 200px;
      border: 1px solid red;
  }
  
  .icon {
      position: absolute;
      bottom: 0;
      left: 0;
      border: 1px solid green;
  }
  </code></pre>
  
  <p>Anyone have any idea how to solve this?</p>