title: CSS: table {width:100%; display:block;} not working in Firefox
body: <p>I have an html table within a div of a specific size. I want the table to apply margin collapse and be 100% wide. Here is my code. It renders how I want it to in IE8 and incorrectly in Firefox. Firefox may be doing the spec correctly, but whatever. How do I fix my css to work in both browsers?</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;meta content="text/html; charset=utf-8" http-equiv="Content-Type" /&gt;
  &lt;title&gt;Untitled 1&lt;/title&gt;
  
  &lt;style type="text/css"&gt;
  table
  {
      border-collapse: collapse;
      border-spacing: 0;
  }
  
  table
  {
      margin: 10px 0;
      width: 100%;
      display: block;
  }
  
  p
  {
      margin: 10px 0;
  }
  
  td, th
  {
      border: 1px solid #000000;
  }
  
  &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;div style="width: 600px; border: 1px purple solid;"&gt;
  
  &lt;p&gt;Some text at the top.  Notice that the margin collapse does not work unless display:block.&lt;/p&gt;
  
  &lt;table&gt;
      &lt;tr&gt;
          &lt;th&gt;&lt;/th&gt;
          &lt;th&gt;Header 1&lt;/th&gt;
          &lt;th&gt;Header 2&lt;/th&gt;
          &lt;th&gt;Header 3&lt;/th&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;Label 1&lt;/td&gt;
          &lt;td&gt;1.A&lt;/td&gt;
          &lt;td&gt;1.B&lt;/td&gt;
          &lt;td&gt;1.c&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;Label 2&lt;/td&gt;
          &lt;td&gt;2.A&lt;/td&gt;
          &lt;td&gt;2.B&lt;/td&gt;
          &lt;td&gt;2.c&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  
  &lt;p&gt;Some text at the bottom.  Notice that the margin collapse does not work unless display:block.  Its stupid.&lt;/p&gt;
  
  
  &lt;/div&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p>I need the display:block for margin collapsing to work in Firefox.  If you remove the display:block, you should notice that the spacing between the <code>&lt;p&gt;</code> tags widens from 10px to 20px.</p>
  
  <p>This is also an edit to <a href="https://stackoverflow.com/questions/3809492/css-table-width100-displayblock-not-working-in-firefox">this</a> question that I posted earlier, but it won't let me edit for some reason.  I've been messing around with my internet cache so I probably messed up a cookie.</p>