How to make border bottom color above border right color?

user_231624 0
Viewed 66

In the example below the border right color takes precedence over the border bottom color.

enter image description here

Is there a way to make the horizontal border line to flow without interruption over the vertical lines?

table th,
table td {
  border-right: 10px solid rgba(229, 231, 235);
  border-bottom: 10px solid rgba(229, 231, 235);
}

table th {
  border-bottom: 10px solid rgba(156, 163, 175);
}
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet"/>
<table>
  <tr>
    <th>a</th>
    <th>b</th>
  </tr>
  <tr>
    <td>1</td>
    <td>1</td>
  </tr>
</table>

css html
1 Answers

is this what you want?

table th,
table td {
  border-right: 10px solid rgba(229, 231, 235);
  border-bottom: 10px solid rgba(229, 231, 235);
}
table tr{
  border-bottom: 10px solid rgba(229, 231, 235);
}
table th {
  border-bottom: 10px solid rgba(156, 163, 175);
}
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet"/>
<table>
  <tr>
    <th>a</th>
    <th>b</th>
  </tr>
  <tr>
    <td>1</td>
    <td>1</td>
  </tr>
</table>

user_74749910
Related