<div class="container">
        <article>
            <h2 class="title">タイトル</h2>
            <p class="author">筆者：みくさん</p>
        </article>
        <article>
            <h2 class="title">タイトル</h2>
            <p class="author">筆者：みくさん</p>
        </article>
        <article>
            <h2 class="title">タイトル</h2>
            <p class="author">筆者：みくさん</p>
        </article>
        <article>
            <h2 class="title">タイトル</h2>
            <p class="author">筆者：みくさん</p>
        </article>
        <article>
            <h2 class="title">タイトル</h2>
            <p class="author">筆者：みくさん</p>
        </article>
        <article>
            <h2 class="title">タイトル</h2>
            <p class="author">筆者：みくさん</p>
        </article>
    </div>

.container {
    width: 300px;
    height: 400px;
    overflow-y: scroll;

    margin: 20px;
    border: 1px solid#333;
}

article {
    padding: 8px 40px;
    background-color: #eee;
}

article+article {
    border-top: 2px dashed #fff;
}

.container::-webkit-scrollbar {
    width: 16px;
}

.container::-webkit-scrollbar-track {
    background-color: #fff;
}

.container::-webkit-scrollbar-thumb {
    background-color: #3760d0;
    border-radius: 8px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.