Site URL: https://cat-orca-hdkp.squarespace.com/

Hii, 

I can't seem to get this element to stick. I used this code but it doesn't seem to work.

@media screen and (min-width:640px) {
div#page-60ca8a1f11785674c0817e2e .col.sqs-col-4.span-4:nth-child(1) {
    position: sticky!important;
    top: 220px;
}
}

PW: brineintopedro

You can add a JavaScript code to add position fixed when the top of the element reaches the top of the browser.

I tried with position sticky but the scenarios did not work

@sorca_marian Do you have a solution using Javascript? Not using Jquery? 

9 minutes ago, dearnaomichan said:

@sorca_marian Do you have a solution using Javascript? Not using Jquery? 

Yes

@sorca_marian ok great because that would be extremely helpful! I am specifically trying to stick the A-Z element on the first section of this page (https://thehighguide.squarespace.com/glossary-a pw: guide) so it sticks at the top over the other section below it. I've make sticky elements within the same section, but never over other sections.

But i've found that Jquery is extremely heavy and weights down the website. Thats why I asked about vanilla javascript. Any advice would be helpful, Thanks!

@dearnaomichan Yes, it is possible wit vanilla JavaScript.

It would take me a few hours to achieve the result and for that amount of hours I request to be hired on Upwork.