Place border-bottom online table with css

Asked

Viewed 1,169 times

1

With I have the following CSS that puts a border on all table rows.

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

Good has some way to make it be put the edge on all the lines except the first TR?

html css

2 answers

4


selector :first-child

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

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

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

.tab_dados tr:first-child {
    border-bottom: none;
}

1

As much as it was considered the first correct answer, I think another solution would be to apply the border to <td> because the edge is not applied to the Tables when not set: table { border-collapse: collapse; } WHEREVER, that 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>

Browser other questions tagged html css

You are not signed in. Login or sign up in order to post.