css border not show, но css применяется

Question

Я пытаюсь применить границу для всех tr в thead.

Css (стилус):

table 
    thead 
     tr 
      border: solid #000; 
      border-width: 0 10px; 

По хрому стили получить применяется, но граница фактически не появляется:

Answer 1

tr нужно его table иметь border-collapse: collapse для границы, чтобы работать

table.first { 
 
    border-collapse: separate;  /* property default */ 
 
} 
 
table.second { 
 
    border-collapse: collapse; 
 
} 
 

 
table thead tr { 
 
    border-bottom: 2px solid gray; 
 
} 
 

 
/* for this demo only */ 
 
div { 
 
    margin: 25px 20px 10px; 
 
    text-decoration: underline; 
 
}

<div>This table's tr (in thead) has no border</div> 
 

 
<table class="first"> 
 
    <thead> 
 
    <tr> 
 
     <td>Left Head</td> 
 
     <td>Right Head</td> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>Left</td> 
 
     <td>Right</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<div>This table's tr (in thead) has border</div> 
 

 
<table class="second"> 
 
    <thead> 
 
    <tr> 
 
     <td>Left Head</td> 
 
     <td>Right Head</td> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>Left</td> 
 
     <td>Right</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 2

thead {color:green;} 
 
tbody {color:blue;} 
 
tfoot {color:red;} 
 

 
table, th, td { 
 
    border: 1px solid black; 
 
}

<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Month</th> 
 
     <th>Savings</th> 
 
    </tr> 
 
    </thead> 
 
    <tfoot> 
 
    <tr> 
 
     <td>Sum</td> 
 
     <td>$180</td> 
 
    </tr> 
 
    </tfoot> 
 
    <tbody> 
 
    <tr> 
 
     <td>January</td> 
 
     <td>$100</td> 
 
    </tr> 
 
    <tr> 
 
     <td>February</td> 
 
     <td>$80</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 3

Я не мастер css, но я обычно пишу свойства границы i п одна строка:

border: 10px solid #000;