title: Align two images to bottom left & right corners of a <div>
body: <p>My page currently has something a bit like the following, in order to put two images on each side of my page header-bar.</p>
  
  <pre><code>    &lt;div id="header" &gt;
          &lt;div style="float:left" &gt;
              &lt;img src="media/logo1.png"/&gt;
          &lt;/div&gt;
          &lt;div style="float:right" &gt;
              &lt;img src="media/logo2.png"/&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>While this works on the left-right alignment, I can't find a good tweak to get both images aligned to the bottom of the parent <code>&lt;div&gt;</code>. They seem to align to the top instead.</p>
  
  <p>However I reckon this might be just the wrong approach to start with. Therefore all suggestions welcome on the best way to make it work - or better, how to arbitrarily force an image to a chosen corner of the parent <code>&lt;div&gt;</code>.</p>