P.K.
P.K.

Reputation: 1772

Table with no external border but with borders on some cells

the is a need to create complex html table (or using divs maybe?). THere are tabular data, but this table cannot have external border, but internal borders( around cells) should exists only for selected cells.

In other words: only some cells hsould have borders and no border "around table".

Can it be done with html table or divs?

Upvotes: 0

Views: 1270

Answers (1)

Rithwik
Rithwik

Reputation: 1198

Yes it is possible with HTML tables. And also with divisions. But I suggest using tables instead of div for tabular data.

Remove table border with :

table {
  border: none;
}

Add borders to required <td> with a class.

.bordered {
  border: 1px solid;
}

table {
  /* Optionally use,
  border-collapse: collapse; */
  border: none;
}

.bordered {
  border: 1px solid;
}
<table>
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
  </tr>
  <tr>
    <td>Peter</td>
    <td class="bordered">Griffin</td>
  </tr>
  <tr>
    <td class="bordered">Lois</td>
    <td>Griffin</td>
  </tr>
</table>

Upvotes: 3

Related Questions