title: joining two pics seamlessly in a div
body: <p>I have two pics <strong>pic1.png (100px x 20px</strong>) and <strong>pic2.png (100px x 380px</strong>) which each are inside a link and <strong>should look like one pic of 100px x 400 px</strong>. Unfortunally (at least in Firefox and IE) as a result there is a <strong>visible gap</strong> of several px between these two pics.</p>
  
  <p><strong>Website-Source</strong> (please excuse that I put it all into one line - but I did not want to possibly falsify the exact code by formatting):</p>
  
  <pre><code>&lt;div style="display:inline-block;width:100px;height:400px;max-height:400px"&gt;&lt;a href="someurl"&gt;&lt;img alt="somealt" title="sometitle" src="pic1.png"&gt;&lt;/a&gt;&lt;a href="someurl"&gt;&lt;img alt="somealt" title="sometitle" src="pic2.png"&gt;&lt;/a&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Can you tell me what is wrong in the above Source and how I could fix it?</p>