h1.both-sides 見出し（両側にライン）
h1.right-side 見出し (右側にライン)
View Compiled 
.both-sides {
  display: flex;
  align-items: center;
  &::before,
  &::after {
    content: '';
    background-color: gray;
    flex-grow: 1;
    height: 1px;
  }
  &::before {
    margin-right: 0.5em;
  }
  &::after {
    margin-left: 0.5em;
  }
}

.right-side {
  display: flex;
  align-items: center;
  &::after {
    content: "";
    background-color: gray;
    flex-grow: 1;
    margin-left: 0.5em;
    height: 1px;
  }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.