title: How can I remove the border from one column of an HtmlTable AND the part of the encompassing table that touches it?
body: <p>I need to remove the border lines from the last column of an htmltable. I tried this on the last "column" (td) of the table:</p>
  
  <pre><code>&lt;td class="nobordercell"&gt;Comments&lt;/td&gt;
  
  .nobordercell {
    border: none;
  }
  </code></pre>
  
  <p>I also tried this (border-collapse: collapse):</p>
  
  <pre><code>&lt;table class="middletable" border="1"&gt;
      &lt;tr&gt;
          . . .
          &lt;td name="airfaredate1Comments" id="airfaredate1Comments" class="nobordercell"&gt;Comments&lt;/td&gt;
      &lt;/tr&gt;
      . . .
  
  .middletable{
      width:99%;
      float:left;
      border-collapse:collapse;
  }
  </code></pre>
  
  <p>The only edge of the border that disappears is the bottom. I realize that this is because the still-showing borders belong to the table, not the td, but still need to know how I can remove the border from the htmltable ONLY on the parts where the td's border and it intersect (or <em>would</em> intersect, if the td's borders were displaying).</p>
  
  <p>This is how it looks currently:</p>
  
  <p><a href="https://i.stack.imgur.com/YWWYz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YWWYz.png" alt="enter image description here"></a></p>
  
  <p>...and this is how I want it to look:</p>
  
  <p><a href="https://i.stack.imgur.com/q8PE8.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/q8PE8.png" alt="enter image description here"></a></p>