Container-Div-Rand kann nicht klebrig gemacht werden ⇐ HTML

[Guest]

Ich habe ein Container-Div, das einen Rand hat. Ich versuche, den oberen Rand beim Scrollen des Inhalts festzuhalten, aber es funktioniert nicht.
Hier ist der HTML-Code:

Code: Select all

Hier ist das CSS:

Code: Select all

    .container{
border: 10px solid red;
position: sticky;
}
.content{
height: 500px;
overflow: scroll;
}

Hier ist ein Demo-Link
Wenn ich scrolle, bleibt der obere Rand nicht hängen.