Adjust width to border of an element

Asked

Viewed 653 times

1

How can I make it so that the black line does not occupy the full width of the element tr? I’d like to narrow down a little bit from the left but with border-width behavior is another.

<tbody>
  <tr class="has-separator">
     <td colspan="2">
        <div class="circle"></div>
            <span>Mês</span>
     </td>
     <td>Nome do curso</td>
     <td>Data do curso</td>
  </tr>
  <tr>
     <td></td>
     <td>Nome do curso</td>
     <td>Data do curso</td>
  </tr>

  <tr class="has-separator">
     <td colspan="2">
        <div class="circle"></div>
           <span>Mês</span>
     </td>
     <td>Nome do curso</td>
     <td>Data do curso</td>
  </tr>
  ...

THE CSS:

table tbody tr:not(:first-child)[class="has-separator"] {
    border-top: 1px solid black;
}

inserir a descrição da imagem aqui

1 answer

1

Try putting the CSS like this:

table tbody tr:not(:first-child)[class="has-separator"]::after {
    content:" ";
    display: block;
    margin: 0px;
    border-top: 1px solid black;
    background: none;
    width: 100%; /*aqui vc coloca o tamanho que quer que ocupe*/
}

Browser other questions tagged

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