枠の上に文字を乗せるやり方 - Qiita<div class="area"> <div class="area__label">ラベル</div> <div class="area__content">コンテンツ</div> </div> .area { position: relative; width: 300px; height: 100px; border: solid 1px #f00; border-radius: 5px; background-color: #fee; &__label { position: absolute; top: 0; left: 20px; font-weight: 600; padding: 0 10px; // paddingを左右にいれて消す線の長さを延ばす transform: translateY(-50%); &::before { position: absolute;
