htmlcsscss-positionsticky

Position sticky not taking effect

I have added this code to my website but there is no effect:

.wp-block-column:not(:first-child) {
    position: sticky;
    top: 0px;
}

Here I share a fiddle to demonstrate: https://jsfiddle.net/9xb0q8fw/1/ Screen must be at least 790px wide.

I would like that the right column stays sticky until the left column has passed while scrolling down.

But position:sticky; is not taking effekt.

Thank you for any help!

Solution

  • The sticky element in your fiddle has no height setting - use a set height to avoid that, then the sticky position works:

    https://jsfiddle.net/rocz5nL1/