title: Active nav tab should not have bottom line
body: <p>I am trying to show a tabbed nav (<code>class="nav nav-tabs"</code>) beneath a table, with a vertical space.</p>
  
  <p>When I use "<code>&lt;p&gt;&amp;nbsp;&lt;/p&gt;</code>" as the spacer, the tabs render correctly. But this is too much space. I prefer to use "<code>&lt;br /&gt;</code>".</p>
  
  <p>However, when I use "<code>&lt;br /&gt;</code>", the first, "Active" tab acquires a horizontal line on its bottom edge. That's wrong.</p>
  
  <p>It looks like this:</p>
  
  <p><img src="https://i.imgur.com/DTInKY2.png" alt="image description"></p>
  
  <p>Here is the code. Although I don't see the problem in the JSFiddle, just on my site (not very helpful?)...</p>
  
  <p><a href="https://jsfiddle.net/iamrobertandrews/ndkmw1te/" rel="nofollow noreferrer">https://jsfiddle.net/iamrobertandrews/ndkmw1te/</a></p>
  
  <p>The problem is evident in Chrome, but not on Safari in either iOS or Mac OS X.</p>