I added an overline to my text, through CSS and selctors - text-decoration and adding value overline. However, the line ends as square corners, I want it to be rounded. How to do that without just drawing a line above text. 

The requirement is attached as an image. 

If you search for "Round cap underline in CSS", there is a stackexchange post for underlines, maybe it will work for overlines. 

Might be just for browsers though.