title: CSS html tables left and right border
body: <p>I'm trying to write some CSS that will make it so my html table only has borders horizontally, and no borders vertically in between columns. </p>
  
  <p>Here is what I have so far:</p>
  
  <pre><code>@charset "utf-8";
  /* CSS Document */
  
  &lt;style type="text/css"&gt;
  
  box-table-a{
      font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
      font-size: 12px;
      margin: 45px;
      width: 480px;
      text-align: left;
      /*border-width: 0px;
      border-left: 0px;
      border-right: 0px;*/
      border-collapse: collapse;
  }
  
  #box-table-a th{
      font-size: 13px;
      font-weight: normal;
      padding: 8px;
      background: #b9c9fe;
      border-right:1px solid #b9c9fe;
      border-left:1px solid #b9c9fe;
      border-top: 4px solid #aabcfe;
      border-bottom: 1px solid #fff;
      color: #039;
  }
  #box-table-a td{
      padding: 8px;
      background: #e8edff; 
      border-bottom: 1px solid #fff;
      color: #669;
      border-top: 1px solid transparent;
  }
  #box-table-a tr:hover td{
      background: #d0dafd;
      color: #339;
  }
  &lt;/style&gt;
  </code></pre>
  
  <p>This results in a table with white borders on all sides.  Any ideas what I'm doing wrong?</p>
  
  <p><em>EDIT</em>
  I can get it to do what I want here: <a href="http://jsfiddle.net/QZwt5/26/" rel="nofollow noreferrer">http://jsfiddle.net/QZwt5/26/</a>
  but when I take this exact table, and exact css into dreamweaver and then ftp to my server I am still getting thin white lines in-between each cell.
  <a href="http://img267.imageshack.us/img267/9135/temppb.jpg" rel="nofollow noreferrer">image http://img267.imageshack.us/img267/9135/temppb.jpg</a></p>
  
  <p>Also just noticed that if I turn off normalized in fiddle that the borders appear on the table there.</p>
  
  <p>Everything is running on an Ubuntu server, I'm building it in winXP and then ftp to Apache, so there might be some permission problems interfering with the CSS?</p>