Question: How can I add text at the top right corner of a table cell without interfering with the existing text content of the cell?

For example, I have a simple HTML table:

```
<table>
<tr>
  <td>Abc</td>
  <td>Defg</td>
</tr>
<tr>
  <td>Hijkl</td>
  <td>Mno</td>
</tr>
</table>

```

It looks like this:
[![enter image description here](https://i.stack.imgur.com/pxkzm.png)](https://i.stack.imgur.com/pxkzm.png)

How can I add a short (one or two word) "label" to the top right corner of a cell such that the table looks like this?
[![enter image description here](https://i.stack.imgur.com/5Rir6.png)](https://i.stack.imgur.com/5Rir6.png)

Answer: 
Put a div inside the td, make it position relative. Add that label as span/div or whatever element, make it absolute with `top: 0, right: 0`
```

Use Following code :
```

`<table>
 <tr>
 <td>Table Data come here
 <div class="topright">Next Code</div>
 </td>
 </tr>
</table>

<style type="text/css">
td {
 position: relative;
 width: 200px;
 height: 200px;
 background: yellow;
}

td .topright { 
 position: absolute;
 top: 0;
 right: 0;
 background: green;
}
</style>`