title: IE7: header above menu
body: <p>I am having trouble with IE7. I have a header, which is an IMG. Under it I have a div that represents a menu, they have to be attached to each other without space in between. Both are 1000px width. In Opera and FireFox the header and the menu are neatly attached to each other. However, in IE7, there is a small space between the menu DIV and the IMG. I have tried explicitly defining padding and margin on the IMG, however it does not work. I have had this problem before, so it seems to be a IE7 quirk.</p>
  <p>My HTML Code:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="middle"&gt;
    &lt;img id="ctl00_headerHolder_headerImage" src="pictures/headers/header_home.jpg" style="border-width:0px;" /&gt;
  
    &lt;div id="ctl00_menuPanel" class="menu"&gt;
      &lt;a id="ctl00_home" href="Default.aspx" style="color:#FFCC33;"&gt;Home&lt;/a&gt; |
      &lt;a id="ctl00_leden" href="Leden.aspx"&gt;Leden&lt;/a&gt; |
      &lt;a id="ctl00_agenda" href="Agenda.aspx"&gt;Agenda&lt;/a&gt; |
      &lt;a id="ctl00_fotos" href="Fotos.aspx"&gt;Foto's&lt;/a&gt; |
      &lt;a id="ctl00_geschiedenis" href="Geschiedenis.aspx"&gt;Geschiedenis&lt;/a&gt; |
      &lt;a id="ctl00_gastenboek" href="Gastenboek.aspx"&gt;Gastenboek&lt;/a&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>