Html ufak bir yardım. (Yazı arkaplanı düzenleme)

Herkese merhabalar, alt tarafta görseldekini yapmaya çalışıyorum ama yapamıyorum yardım edebilir misiniz?

Görsel:
Kod:

<h1 style="border-bottom:1px solid #e1e1e1; height:10px; font-size:18px; font-weight:600; background-color:#ffffff; padding:0 100px; text-align: center;">ÇOK SATANLAR</h1>

Kod çıktısı:"çok satanlar" yazısının arkasını bi türlü beyaz yapamadım. Sanırsam span falan açarak yapmam gerekiyor da tam beceremedim. Herkese şimdiden teşekkürler.

Hocam çok satanları span içine alın spanı'ın displayını inline-block verin arkada ki çizgi yi h1 de var sayıyorum span'a after veya before vererek after'a beyaz bir bg vermeniz lazım.

bg-color değil miydi

<div class="coksatan">ÇOK SATANLAR</div>

.coksatan{
display: flex;
align-items: center;
text-align: center;
}
.coksatan::before, .coksatan::after {
content: '';
flex: 1;
border-bottom: 1px solid #000;
}
.coksatan::before {
margin-right: .25em;
}
.coksatan::after {
margin-left: .25em;
}

buyur

<style>
span {
background-color: white;
}
</style>
<h1 style="border-bottom:1px solid #e1e1e1; height:10px; font-size:18px; font-weight:600; padding:0 100px; text-align: center;"><span>ÇOK SATANLAR</span></h1>

<style>
span {
background-color: white;
padding: 0 15px
}
</style>
<h1 style="border-bottom:1px solid #e1e1e1; height:10px; font-size:18px; font-weight:600; padding:0 100px; text-align: center;"><span>ÇOK SATANLAR</span></h1>

Dener miyiz

Herkese teşekkür ederim