title: Remove column dividers in a html table
body: <p>I have a html table with CSS. Currently all the cells have a white border around them, I am having trouble removing the column borders for each cell so the rows are divided by a white line. A similar table to what I'm trying to achive can be seen at <a href="http://www.smashingmagazine.com/2008/08/13/top-10-css-table-designs/" rel="nofollow noreferrer">http://www.smashingmagazine.com/2008/08/13/top-10-css-table-designs/</a>, look at example 3 (the top table in this example). So far my code looks like:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;style type="text/css"&gt;
  table, td, th
  {
  font-family:calibri;
  border:collapse:collapse;
  }
  th
  {
  background-color:#b9c9fe;
  color:#006add;
  }
  td
  {
  background-color:#e8edff;
  color:#666699;
  }
  &lt;/style&gt;
  
  &lt;body&gt;
  &lt;table cellpadding="5" &gt;
  &lt;tr&gt;
  &lt;th&gt;Firstname&lt;/th&gt;
  &lt;th&gt;Lastname&lt;/th&gt;
  &lt;th&gt;Savings&lt;/th&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td&gt;Peter&lt;/td&gt;
  &lt;td&gt;Griffin&lt;/td&gt;
  &lt;td&gt;$100&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td&gt;Lois&lt;/td&gt;
  &lt;td&gt;Griffin&lt;/td&gt;
  &lt;td&gt;$150&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td&gt;Joe&lt;/td&gt;
  &lt;td&gt;Swanson&lt;/td&gt;
  &lt;td&gt;$300&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td&gt;Cleveland&lt;/td&gt;
  &lt;td&gt;Brown&lt;/td&gt;
  &lt;td&gt;$250&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>