Why TR not taking style?

Question

CSS

table tr {border-bottom:1px solid #008999}

HTML

<table width="100%" cellspacing="0" cellpadding="0">
   <thead>
      <tr>
         <th scope="col">one</th>
         <th scope="col">two</th>
         <th scope="col">three</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <th scope="row">Hello</th>
         <td>&nbsp;</td>
         <td>&nbsp;</td>
      </tr>
   </tbody>
</table>

Answer 1

Add:

table {     border-collapse: collapse; } 

Otherwise tr creates no single block.

Simple example:

table  {    border: 5px solid #900;    background: #fff;  }  tr  {    border: 5px solid #090;  }  td  {    background: #ccc;    padding: 5px 0;  }    table + table  {    border-collapse: collapse;  }

<table>    <tr>      <td>def</td>      <td>ault</td>    </tr>  </table>  <table>    <tr>      <td>coll</td>      <td>apse</td>    </tr>  </table>

Answer 2

Try giving

table tr th {border-bottom:1px solid #008999} 

Then you can use

table { border-collapse: collapse; } table tr {border-bottom:1px solid #008999; } 

See The collapsing border model

Answer 3

tr by definition wont take border styles. You need to apply it to the td's within it:

table tr td {border-bottom:1px solid #008999}