title: Internet Explorer 8 bug with display: table
body: <p>I have the weirdest bug ever... I'm experimenting with display: table, and my proof of concept works on the very first try after opening a new process, but any subsequent reloading of the page breaks the design. Here is the simple HTML page:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
      &lt;title&gt;Untitled Page&lt;/title&gt;
      &lt;style&gt;
          .container {
              display: table;
          }
  
          .row {
              display: table-row;
          }
  
          .cell {
              display: table-cell;
              width: 100px;
              height: 100px;
              border: 1px solid blue;
              padding: 1em;
          }
      &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div class="container"&gt;
          &lt;div class="row"&gt;
              &lt;div class="cell"&gt;CELL A&lt;/div&gt;
              &lt;div class="cell"&gt;CELL B&lt;/div&gt;
              &lt;div class="cell"&gt;CELL C&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And here is the expected result, this is what I get after loading the first time.</p>
  
  <p><img src="https://i.stack.imgur.com/oQ3ZQ.gif" alt="alt text"></p>
  
  <p>Now that's what I get after reloading the page, with F5:</p>
  
  <p><img src="https://i.stack.imgur.com/bdAQi.gif" alt="alt text"></p>
  
  <p>It's insane!!!</p>
  
  <p>Can someone please try it and let me know how it comes out for them? Thank you. I hope I will not have killed myself by the time I read the solution :-)</p>