fix problems with scope in tables when using th in tbody

1 files changed, 24 insertions, 7 deletions

diff --git a/lib/tables.less b/lib/tables.less
index 2781681cc..158f06d93 100644
--- a/lib/tables.less
+++ b/lib/tables.less
@@ -11,11 +11,8 @@ table {
   width: 100%;
   margin-bottom: @baseline;
   padding: 0;
-  border-collapse: separate; // Done so we can round those corners!
-  *border-collapse: collapse; /* IE7, collapse table to remove spacing */
   font-size: @basefont;
-  border: 1px solid #ddd;
-  .border-radius(4px);
+  border-collapse: collapse;
   th, td {
     padding: 10px 10px 9px;
     line-height: @baseline;
@@ -29,9 +26,27 @@ table {
   }
   td {
     vertical-align: top;
+    border-top: 1px solid #ddd;
+  }
+  // When scoped to row, fix th in tbody
+  tbody th {
+    border-bottom: 0;
+    vertical-align: top;
   }
+}
+
+
+// BORDERED VERSION
+// ----------------
+
+.bordered-table {
+  border: 1px solid #ddd;
+  border-collapse: separate; // Done so we can round those corners!
+  *border-collapse: collapse; /* IE7, collapse table to remove spacing */
+  .border-radius(4px);
   th + th,
-  td + td {
+  td + td,
+  th + td {
     border-left: 1px solid #ddd;
   }
   tr td {
@@ -89,10 +104,12 @@ table {
 // Default zebra-stripe styles (alternating gray and transparent backgrounds)
 .zebra-striped {
   tbody {
-    tr:nth-child(odd) td {
+    tr:nth-child(odd) td,
+    tr:nth-child(odd) th {
       background-color: #f9f9f9;
     }
-    tr:hover td {
+    tr:hover td,
+    tr:hover th {
       background-color: #f5f5f5;
     }
   }