title: removing space between vertical divs
body: <p>i have three vertical aligned divs on top of each other. the top and bottom are just showing an image on top and bottom of the player .hence coordination becomes like this</p>
  
  <pre><code>&lt;div&gt;
   &lt;img&gt;top&lt;/img&gt;
  &lt;div&gt;
  &lt;div&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;div&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div&gt;
   &lt;img&gt;bottom&lt;/img&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>now there is white line/space between the middle div on its top and bottom. However i explicitly set the margins and pendings and borders to zero but still no solution.</p>
  
  <p>This problem is not occuring in IE6/IE7/IE8 etc but all other browsers.</p>
  
  <p>Thanks bobince, its working on top image side by making vertical-align:bottom but not working for the bottom image. whom i trying to place on top.</p>
  
  <p>ok here is the detail code</p>
  
  <pre><code>&lt;div id="top" &gt;
      &lt;img alt="topimage" style="vertical-align:bottom"&gt;
        &lt;xsl:attribute name="src"&gt;
          &lt;xsl:value-of select="TopImage"/&gt;
        &lt;/xsl:attribute&gt;
      &lt;/img&gt;
    &lt;/div&gt;
    &lt;div id="container" style="clear:both;display:block;margin: 0 0 0 0;padding: 0 0 0 0;text-align:left;border:0 none;"&gt;
      &lt;div id="left" style="margin: 0 0 0 0;padding: 0 0 0 0;float: left;"&gt;
        &lt;img alt="left image"  style="margin: 0 0 0 0;padding: 0 0 0 0;vertical-align:bottom"&gt;
          &lt;xsl:attribute name="src"&gt;
            &lt;xsl:value-of select="LeftImage"/&gt;
          &lt;/xsl:attribute&gt;
        &lt;/img&gt;
      &lt;/div&gt;
  
      &lt;div id="flashde260252-c874-4c67-b1aa-64ebe80bb701"  style="margin: 0 0 0 0;padding: 0 0 0 0;float:left;border:0;vertical-align:bottom"&gt;
        &lt;embed id="flashde260252-c874-4c67-b1aa-64ebe80bb7010" height="308" width="512" allowfullscreen="true" wmode="transparent" quality="high" bgcolor="#ffffff" name="flashde260252-c874-4c67-b1aa-64ebe80bb7010" style="margin: 0 0 0 0;padding: 0 0 0 0;"  type="application/x-shockwave-flash"&gt;
          &lt;xsl:attribute name="src"&gt;
            &lt;xsl:value-of select="Movie"/&gt;
            &lt;xsl:text&gt;?flvfile=&lt;/xsl:text&gt;
            &lt;xsl:value-of select ="Destination"/&gt;
            &lt;xsl:text &gt;&amp;amp;lang=e&amp;amp;environment=PROD&lt;/xsl:text&gt;
          &lt;/xsl:attribute&gt;
        &lt;/embed&gt;
      &lt;/div&gt;
  
      &lt;div id="rightimage" style="margin: 0 0 0 0;padding: 0 0 0 0;float:left;"&gt;
        &lt;img alt="rightimage"  style="vertical-align:bottom"&gt;
          &lt;xsl:attribute name="src"&gt;
            &lt;xsl:value-of select="RightImage"/&gt;
          &lt;/xsl:attribute&gt;
        &lt;/img&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;!-- &lt;div id="bcontainer" style="margin: 0 0 0 0;padding: 0 0 0 0;text-align:left;border-left:0;border-right:0;border-top:0;border-bottom:0px;border:none;"&gt;--&gt;
    &lt;div id="bottom" style="clear:both;display:block;margin: 0 0 0 0;padding: 0 0 0 0;vertical-align:top;text-align:left;border:0 none"&gt;
      &lt;img alt="subscribe" src="IRBBottom.jpg" usemap="#promomap" border="0" style="vertical-align:top"&gt;
        &lt;xsl:attribute name="src"&gt;
          &lt;xsl:value-of select="BottomImage"/&gt;
        &lt;/xsl:attribute&gt;
      &lt;/img&gt;
    &lt;/div&gt;
    &lt;!-- &lt;/div&gt; --&gt;
    &lt;div id="toc" style="clear:both;display:block;text-align:left;"&gt;
      &lt;ol style="list-style:none;font-size:small;font-weight:bold"&gt;
        &lt;li&gt;* Includes all matches from main pitch, plus selected matches from pitch 2 - see FAQ for details.&lt;/li&gt;
        &lt;li&gt;** Includes all matches on Finals Day, March 7th from main pitch - see FAQ for details.&lt;/li&gt;
        &lt;li&gt;*** All matches on main pitch will be live and matches on pitch 2 will be on demand - see FAQ for details.&lt;/li&gt;
      &lt;/ol&gt;
    &lt;/div&gt;
    &lt;map name="promomap"&gt;
      &lt;area shape="rect" coords="229,46,350,137" href="index.html" alt="Subscribe or Login" title="Subscribe or Login"/&gt;
      &lt;area shape="rect" coords="410,47,528,137" href="XXX.html" alt="R Video" title="Ro"/&gt;
    &lt;/map&gt;
    &lt;script type="text/javascript"&gt;
      &lt;xsl:text disable-output-escaping="yes"&gt;
    function showMovie(player,movie,endthumb,destination){
      var so = new SWFObject(player+'?flvfile='+movie+'&amp;amp;endthumb='+endthumb +'&amp;amp;endlink='+destination,'flashde260252-c874-4c67-b1aa-64ebe80bb7010','512','308','8', '#ffffff', 'high','');
      so.addParam('wmode', 'transparent');so.addParam('allowfullscreen', 'true');so.write('flashde260252-c874-4c67-b1aa-64ebe80bb701');
    }
    &lt;/xsl:text&gt;
      &lt;xsl:text&gt; showMovie('&lt;/xsl:text&gt;
      &lt;xsl:value-of select="Player"/&gt;
      &lt;xsl:text&gt;','&lt;/xsl:text&gt;
      &lt;xsl:value-of select="Movie"&gt;&lt;/xsl:value-of&gt;
      &lt;xsl:text&gt;','&lt;/xsl:text&gt;
      &lt;xsl:value-of select="EndThumb"/&gt;
      &lt;xsl:text&gt;','&lt;/xsl:text&gt;
      &lt;xsl:value-of select="Destination"/&gt;
      &lt;xsl:text&gt;');&lt;/xsl:text&gt;
    &lt;/script&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>:) now its working in all except IE's lol , after setting up the line-height</p>