title: <img> in <table> without any spaces
body: <p>I am trying to put two images side by side inside a <code>&lt;td&gt;</code> (also tried one <code>&lt;td&gt;</code> for each img), but has some white spaces between the images, and do not understand where they come .. I can solve my problem using float, but I'm trying to avoid this. If someone can explain to me why this happens. I took some tips from other questions, but it doesn't work.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;style "text/css"&gt;
          td, tr, img  { padding: 0px; margin: 0px; border: none; }
          table { border-collapse: collapse;} 
      &lt;/style&gt;
  &lt;/head&gt;
  &lt;body style="background: black;"&gt;
      &lt;center&gt;
          &lt;table cellspacing="0" cellpadding="0"&gt;
              &lt;tr&gt;
                  &lt;td&gt;
                      &lt;img alt="" title="" src="http://i.min.us/ijCTdY.jpg" /&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td&gt;
                      &lt;img alt="" title="" src="http://i.min.us/jj7Yt6.jpg"/&gt;
                      &lt;img alt="" title="" src="http://i.min.us/ijCo96.jpg"/&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/table&gt;
      &lt;/center&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>you can notice that the top image has 800 px height, and the other ones has 400px each one, what I need is some kinda square, without any spaces between the images.</p>