タイトルの左右に線を引くスタイルシート

タイトルで使われる左右に線のあるデザインをスタイルシートで行う。

.titleLine {
    display: flex;
    align-items: center;
    &:before,
    &:after {
        border-top: 1px solid;
        content: "";
        flex-grow: 1;
    }
    &:before {
        margin-right: 15px;
    }
    &:after {
        margin-left: 15px;
    }
}

参考サイト

のんびりデザインしているような。

タイトルの左右に横線を引くCSSをなるべく簡単に考えてみた

https://timing-web.com/textborder/