title: How can I make "display: block" work on a <td> in IE?
body: <p>Is there anything I can do to make IE display table cells as actual blocks?</p>
  
  <p>Given this style:</p>
  
  <pre><code>table,tbody,tr,td,div {
    display: block;
    border: 1px solid #0f0;
    padding: 4px;
  }
  </code></pre>
  
  <p>And this html:</p>
  
  <pre><code>&lt;table&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;td&gt;R1C1&lt;/td&gt;
        &lt;td&gt;R1C2&lt;/td&gt;
        &lt;td&gt;R1C3&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  
  &lt;div&gt;
    &lt;div&gt;
      &lt;div&gt;
        &lt;div&gt;R1C1&lt;/div&gt;
        &lt;div&gt;R1C2&lt;/div&gt;
        &lt;div&gt;R1C3&lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The table renders exactly the same as the nested divs in both Firefox and Safari/Chrome. But in Internet Explorer (8) the property <code>display: block</code> has no effect. The table renders exactly as if I don't set that property.</p>
  
  <p>My main problem is that the cells don't break; They all render on one line. (The <code>tbody</code> and <code>tr</code> elements don't get any borders nor padding. That is not a problem for me right now, though.)</p>
  
  <p>I haven't found any information on the problem when searching. Compatibility charts <a href="http://www.quirksmode.org/css/display.html">on quirksmode</a> and elsewhere states that IE supports <code>display: block</code> since v. 5.5. Any discussion on table display problems seems to be when doing the reverse - giving non-table elements any of the <code>display: table-*</code> properties.</p>
  
  <p>So once again, is there anything I can do to make IE render table cells as block?</p>
  
  <p>(The real table is really a table, with tabular data. I would like to keep it that way, and restyle it unobtrusively.)</p>