Put border-bottom inline table with css

1

With I have the following CSS that places a border on every row of the table.

.tab_dados tr {
  height: 50px;
  border-bottom: 1px solid #D5D5D5;
}

Is there any way to do that, so I put the border on all rows, less on the first TR ?

    
asked by anonymous 24.08.2017 / 17:57

2 answers

4

use selector :first-child

But you will need to use the not() selector to apply on all but the first child:

.tab_dados tr:not(:first-child) {
    border-bottom: 1px solid #D5D5D5;
}

Or you can simply remove the border of the first child:

.tab_dados tr:first-child {
    border-bottom: none;
}
    
24.08.2017 / 18:00
1

As far as the first correct answer was considered, I think another solution would be to apply the border to <td> because the border is not applied to tables when not set: table { border-collapse: collapse; } WHEREVER , this would be another solution.

table tr:not(:first-child) td{
  height: 50px;
  border-bottom: 1px solid #D5D5D5;
}
<table>
  <tr>
    <td> Item 11</td>
    <td> Item 12</td>
    <td> Item 13</td>
    <td> Item 14</td>
  </tr>
  
  <tr>
    <td> Item 21</td>
    <td> Item 22</td>
    <td> Item 23</td>
    <td> Item 24</td>
  </tr>
</table>
    
24.08.2017 / 18:22