Title with bottom border smaller than width

Question

I need to create an underline effect with a bottom border that is smaller than the h2 title\'s width. Usually I don\'t upload images but I figu

Answer 1

Other approach :

Box shadow with a negative spread radius :

body{text-align:center;}
h2{
  font-size:40px;
  color:#409FB3;
  display:inline-block;
  height:50px;
  box-shadow: 0 25px 0 -23px #5CC7A8;
}

<h2>Some title</h2>

Note : you need to make sure that - spread-radius x2 < height otherwise the box-shadow will have 0 height and disapear.