user6819867
user6819867

Reputation:

How to set border on tables

Suppose I have a table element with good amounts of data.

table {
  background-color: skyblue;
  width: 100%;
  margin: auto;
  text-align: center;
}
<table>
  <tbody>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
  </tbody>
</table>

What would be the best way to set a border of border-style: dashed; border-color: black; border-size: 3px; on each even td.

Please explain this.

Upvotes: 0

Views: 99

Answers (1)

Turi S.
Turi S.

Reputation: 331

You could try:

td:nth-child(even) {
   border-style: dashed; 
   border-color: black; 
   border-size: 3px;
}

Upvotes: 6

Related Questions