title: Bootstrap table-hover border-top color change
body: <p>The table-hover class in bootstrap applies the default border-top with color of grey to all the rows. <a href="http://getbootstrap.com/css/#tables" rel="nofollow">see getBootstrap definition</a></p>
  
  <p>How do I change the border-top color for all the rows?
  I know I can change the hover background color using the following:</p>
  
  <pre><code>.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: white;
  }
  </code></pre>
  
  <p>Adding </p>
  
  <pre><code>border-color:1px solid black;
  </code></pre>
  
  <p>won't work.</p>
  
  <p>Adding </p>
  
  <pre><code>.table {
    border-color: 1px solid black;
  }
  </code></pre>
  
  <p>also won't work.</p>
  
  <p>Here is my table structure</p>
  
  <pre><code>.tab {
      font-size:1em;
      color:black;
      font-family: monospace;
      margin-top:60px;
      text-align:center;
      float:left;
      width:30%;
    }
  
  
  &lt;div class="container"&gt;
      &lt;div class="tab"&gt;
          &lt;table class="table table-hover "&gt;
              &lt;thead&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;b&gt;All Users&lt;/b&gt;&lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
              &lt;tbody&gt;
                  something..
              &lt;/tbody&gt;
          &lt;/table&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Thanks</p>