Apply edge only to a td [closed]

0

I have the following two simple tables, what I want to do is apply the border only a pair of elements td but that remain with the same style as when applied to the whole table as such, this is what I wear and can not recreate the style, what can I correct to achieve what I expect?

*{
  font-family: Arial;
  text-align: center;
  font-size: 24px;
}

td{
  width: 50px;
}

.border{
  border: solid 1px black;
}
<table border="1" align="center" cellspacing="0" cellpadding="0">
  <thead>
    <tr >
      <td colspan="2">foo</td>
      <td >bar</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td colspan="2">foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td colspan="2">foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td>foo</td>
      <td>bar</td>
      <td>foo</td>
    </tr>
  </tbody>
</table>

<br />

<table border="0" align="center" cellspacing="0" cellpadding="0">
  <thead>
    <tr class="">
      <td class="border">foo</td>
      <td class="border">bar</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td>foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td>foo</td>
      <td>bar</td>
    </tr>
  </tbody>
</table>
    
asked by Jorius 18.12.2016 в 23:32
source

1 answer

1

*{
  font-family: Arial;
  text-align: center;
  font-size: 24px;
}

td{
  width: 50px;
}

#uno,#dos{
border: solid 1px black;
}
<table border="1" align="center" cellspacing="0" cellpadding="0">
  <thead>
    <tr >
      <td colspan="2">foo</td>
      <td >bar</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td colspan="2">foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td colspan="2">foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td>foo</td>
      <td>bar</td>
      <td>foo</td>
    </tr>
  </tbody>
</table>

<br />

<table border="0" align="center" cellspacing="0" cellpadding="0">
  <thead>
    <tr class="">
      <td class="border">foo</td>
      <td class="border">bar</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td>foo</td>
      <td>bar</td>
    </tr>
    <tr>
      <td id="uno">foo</td>
      <td id="dos">bar</td>
    </tr>
  </tbody>
</table>
    
answered by 18.12.2016 в 23:49