JSFiddle - React, Tailwind, and code Playground
HTML
<h3>My Title <a href="#">link</a></h3>
CSS
h3 {
display:block;
margin:20px auto;
padding:6px;
width:85%;
text-align:left;
font: 21px 'lucida sans'; color:#444;
border-bottom:#ccc 1px solid;
}
h3 a{
margin:0; padding:8px 4px 0 0;
display:inline;
float:right;
width:auto;
text-decoration:none;
font: 14px 'lucida sans';
}
h3 a:before{
content: '+';
margin:0;
padding: 4px;
position: absolute;
left: -15px;
top: 3px;
}
h3 a:hover { position: relative; }
h3 a:hover:after{ content:""; position: absolute; height: 1px;
right: 4px; /* depends of the right padding */
left: 0; /* depends of the left padding */
background-color: blue; /* depends of the link color */
top: 23px; /* depends of the overall line-height */ }