Position div off screen to the top and only show specific height of bottom portion of the div

Is there any CSS only solution to position a dynamic height div off the screen to the top and only show a fixed height bottom portion of it on the screen?

See image for a clear explanation:

I know this can be done using javascript by simply getting the height of the div and then setting the "top" property to negative height of the div + the height of the portion to be visible, but I am looking for a non JS solution.