HTML - How to make a single cell in a table bordered

We can do this in two ways

• HTML

Nested tables helps us in this. Check the following snippet

{code}
<table border="0" cellspacing="0" cellpadding="4">
<tr> <td>Apple</td>
     <td><table border="1" cellpadding="4">
        <tr><td>Ball</td></tr></table></td>
     <td>Cat</td> </tr>
</table> {/code}

The second <table> with border will solve the problem. The code looks as follows in a browser:

• CSS

This is the better way of fixing the same issue:

{code}

<table border="0" cellspacing="0" cellpadding="4"><tr>
  <td>Apple</td>
  <td><div style= "border: solid 0 #060; border-width:2px; padding:0.5ex">Ball</div></td>
  <td>Cat</td>
</tr></table>

{/code}

The above snippet will show border only for the second cell and will look as follows in the browser: