下線にpaddingを指定したい text-decoration : underline

text-decoration : underlineにpaddingを指定されたようなデザインがある場合…、CSSのデフォルトでは対応ができません😕

そんな場合の対応法です。
border-bottomと display:inlineを使って対応できます。

#CSS

h2{
  border-bottom:2px solid #f00;
  padding-bottom:5px;
  display:inline;
  line-height:2;
}

#デモ

See the Pen 下線が2行でpadding-bottomを指定したい by harumi-sato (@harumi-sato) on CodePen.