<div class="box">
<div class="header">Заголовок</div>
<div class="inner">Текст</div>
<div class="inner">Текст</div>
<div class="inner">Текст</div>
<div class="inner">Текст</div>
<div class="inner">Текст</div>
<div class="inner">Текст</div>
<div class="inner">Текст</div>
<div class="inner">Текст</div>
</div>
.box{
width: 500px;
height: 300px;
overflow: scroll;
position: relative;
}
.box > div {
margin-bottom: 10px;
padding: 15px 10px;
}
.header{
position: sticky;
top: 0;z-index: 2;
background: #fff;
z-index: 100;
}
.header::before{
content:'';
display: block;
top: 0;
left: 0;
height: 100%;
width: calc(100% - 6px);
position: absolute;
background: white;
z-index: -1;
border: 3px solid black;
border-radius: 15px;
}
.inner{
border: 3px solid black;
border-radius: 15px;
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.