I’m looking to create this scenario:

1. a sticky header (title bar in this example)
2. that’s responsive if the screen width increases (e.g. dragging the outer frame)
3. that also stays in front of the content below it when scrolled

However, I can only seem to be able to be able to achieve the first two - see screenshots below. 

Is this scenario possible and if so how? Cheers!