<!DOCTYPE html>
<style>
    div {
        display: block;
        width: 400px;
        height: 100px;
        color: blue;
    }
    #underlineHover {
        text-decoration: underline;
    }
</style>
<div id="underlineHover">
<span>When</span> <span>hovered, </span><span>there</span> <span>should</span>   <span>  be </span> <span>no</span> <span>gaps</span> <span>in</span> <span>the</span> <span>underline.</span>
</div>

<div id="underlineNoHover">
<span>When</span> <span>not hovered, </span><span>there</span> <span>should</span>   <span>  be  </span> <span>no</span> <span>underlines.</span>
</div>