title: Last TD and Second last TD in TR (CSS / LESS)
body: <p><strong>After Google-ing and stackoverflow-ing,</strong> I still haven't been able to solve this one:</p>
  
  <p>I have a table with about a dozen rows. One of the rows looks like this:</p>
  
  <pre><code>&lt;tr class="rvw-product-total"&gt;
      &lt;td colspan="2"&gt;&lt;/td&gt;
      &lt;td&gt;Total:&lt;/td&gt;
      &lt;td&gt;$180.67&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>The last two TDs in this row (Total and $180.67) should have a green <code>background-color</code> and <code>bold</code> text. </p>
  
  <p>So I can get this accomplished in CSS/LESS like so:</p>
  
  <pre><code>tr[class="rvw-product-total"]:last-child td, tr[class="rvw-product-total"]:nth-child(n+2) td {
      font-weight: bold;
      background-color: #DFF0D8;
  }
  </code></pre>
  
  <p>That makes the <code>background-color</code> of the entire row green.</p>
  
  <p>Then I've tried explicitly setting the <code>background-color</code> of the first TD to white, like so:</p>
  
  <pre><code>tr[class="rvw-product-total"]:first-child td {
      background-color: #fff;
  }
  </code></pre>
  
  <p>But the entire row still remains the green <code>background-color</code>, and I'm just curious what I'm doing wrong here?</p>
  
  <p>Here's a quick demonstration on jsfiddle: <a href="http://jsfiddle.net/acegyver/EYVvc/2/" rel="nofollow">http://jsfiddle.net/acegyver/EYVvc/2/</a></p>