title: Override Bootstrap table border-collapse style
body: <p>Bootstrap has a <code>table {border-collapse: collapse; border-spacing:0;}</code> style.  I want to override this so I've create a class and applied it to the table in question:</p>
  
  <pre><code>table.FormGroupContainer
  {
      border-collapse: separate;
      border-spacing: 2px;
  }
  </code></pre>
  
  <p>but <em>still</em> the borders remain collapsed.  The Chrome element inspector shows the Bootstrap CSS has been overridden but only disabling the style in the inspector allows a border spacing.  I have observed this in IE 11 and Firefox 31.0.  Inline styles also appear to override (as shown in Chrome inspector) but have no effect until I disable the Bootstrap style.</p>
  
  <p>CSS load order also seems to make no difference.  <em>What gives?</em> Isn't the class higher specificity?</p>