title: Unusual nesting of table, table-row and table-cell
body: <p>I want to convert several nested divs (like below) into a CSS table structure with the display styles of table, table-row and table-cell. This works fine. But there are some other elements in the DOM structure (identified below by classes "red" and "blue") which I cannot remove but I don't need them for the appearance on the screen. If I leave these elements in the DOM tree, the table structure doesn't display correctly. Is there any possibility to let them in the DOM tree but ignore them on display?</p>
  
  <pre><code>&lt;div style="display: table"&gt;
    &lt;div class="blue"&gt;
      &lt;div style="display: table-row"&gt;
        &lt;div class="red"&gt;
          &lt;div style="display: table-cell"&gt;
            ...
          &lt;/div&gt;
          &lt;div style="display: table-cell"&gt;
            ...
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div style="display: table-row"&gt;
        &lt;div class="red"&gt;
          &lt;div style="display: table-cell"&gt;
            ...
          &lt;/div&gt;
          &lt;div style="display: table-cell"&gt;
            ...
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>