Spacing between text and underline

css, html, underline

Solution

Not without tricks, no. One simple solution is to wrap the text in another span and give that a bottom border.

.title_span {
  font-weight: bold;
  text-decoration: underline;
  color: grey;
}

.underline {
  padding-bottom: 2px;
  border-bottom: grey 1px solid;
}

<span class="underline">
  <span class="title_span">title of something</span>
</span>

Problem

I am looking for a way to enlarge the distance between the text and underline on my pages. i use mainly CSS but i had to use tags as well, basicly my question considers both cases. is there a way to change this spacing? the code is pretty simple: ``` .title_span { font-weight: bold; text-decoration: underline; color: grey; } ``` my other posibility is try somehow use background for the span using 1px picture and repeat against X axis i am looking for cleaner solution.

Original source