title: Table cell sizing in Chrome and IE
body: <p>I have a <a href="http://jsfiddle.net/alirezamirian/TgxJa/" rel="nofollow">HTML table</a><br>
  Required details are mentioned in JSFiddle.<br>
  This is working well on Firefox, but it's not on Chrome and IE!
  what's wrong with them? why they expand the cell in the last row which has a fixed height, instead of second row which is the only cell with not-determined height in first column.<br>
  Here is the HTML code:<br></p>
  
  <pre><code>&lt;table style="width: 100%;" dir="rtl" cellpadding="0" cellspacing="0"&gt;
  &lt;tr&gt;
      &lt;td style="height: 100px; width: 176px; background:blue"&gt;
          this is a fixed size cell
      &lt;/td&gt;
      &lt;td rowspan="3" style="background:gray; height: 360px;"&gt;this cell is spanned 3 rows&lt;br /&gt; lots of content may be placed here&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td style="background:red"&gt;this should expand depending on gray region&lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr&gt;    
      &lt;td style="height: 46px; background:blue"&gt;this is a fixed size cell&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p></p>