文字の横に線(ライン)を引く方法2

<p class="title">タイトル</p>

文字に右側だけに短いライン

display: flex;
align-items: center;
&::after {
	background: #333;
	content: "";
	height: 1px;
	width: 3em;
	margin-left: 1em;
}

ただし、画面が狭くなるとflexboxが影響して崩れるので、折り返さないサイズに納める必要がある。