title: Css - Last Table Row Regardless of TD or TH
body: <p>How can I use a CSS selector that will always catch the last row of a table and apply a rule to the last division, regardless if it is a TD or a TH, but not altering the last TH in the table.</p>
  
  <p>My current rule only applies to if it is a TD, and all ways that I've found to make the TH round, it would round even if there's more TDs in it.</p>
  
  <pre><code>.tabGeral tr:first-child th:first-child  {
      border-top-left-radius:14px;
  }
  .tabGeral tr:first-child th:last-child  {
      border-top-right-radius:14px;
  }
  .tabGeral tr:last-child td:last-child {
      border-bottom-right-radius:14px;
  }
  .tabGeral tr:last-child td:first-child{
      border-bottom-left-radius:14px;
  }
  </code></pre>
  
  <p>Top two are the desired result, the two on the bottom is what I'm achieving
  <img src="https://i.stack.imgur.com/RiGzD.png" alt="Top two are the desired result, the two below is what I&#39;m achieving"></p>
  
  <p>JSFiddle: <a href="https://jsfiddle.net/rd48cfw8/3/" rel="nofollow noreferrer">https://jsfiddle.net/rd48cfw8/3/</a></p>
  
  <p>The two dark green are THs, the light colored green is a TD, I need them to be TH and TD because of table sorter.</p>
  
  <p>If I use only <code>tr:last-child td:first-child</code>, the second table isn't achieved, if I use only <code>tr:last-child th:first-child</code>, the first table isn't achieved, if I use a combination of both, I get the fourth table, not desired.</p>