I tried :
.bb {
border-bottom:1px;
}
<tr class="bb">
But no effect at all.
Not directly: adding a border to a tr isn't allowed. But you can target the first and last cell, give those a left/right border respectively. Then on each cell put a top border and a bottom border on each td element.
Solution with the CSS border-bottom property If you want to add a border only to the bottom of the table row, you can apply the CSS border-bottom property to <td> elements that are placed within a <tr> tag.
Borders can be added to rows of table by adding border to <td> and <th> elements [This is basically a CSS trick to achieve (hack!) that as borders cannot be added to <tr> and <tbody> elements of table]. Add following styles to your CSS to get borders around rows or headers or table cells.
Try the following instead:
<html>
<head>
<title>Table row styling</title>
<style type="text/css">
.bb td, .bb th {
border-bottom: 1px solid black !important;
}
</style>
</head>
<body>
<table>
<tr class="bb">
<td>This</td>
<td>should</td>
<td>work</td>
</tr>
</table>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With