How can I double underline a text inside a html table cell?

Question

Both underline should be of length corresponding to the text content. I've come across another similar question where the accepted solution was to use

.doubleUnderline {
text-decoration:underline;
border-bottom: 1px solid #000;
}

But this is not what I wanted. I want the length of the double underline to be equal to the length of the text content.

Answer 1

I've whipped two examples.

With block elements (like p) you can use inline-block so it doesn't go the full length of page and just the text.

span{
  border-bottom:1px solid #000;
  text-decoration:underline;
}
        
p{
  border-bottom:1px solid #000;
  text-decoration:underline;
  display:inline-block;
}

<span>This is a bit of text for you</span>
<br>
<p>This is some text for you too</p>