How to make sticky add to cart studio them

[Zakariatheguy]

Hi there, I would like to know how to add a sticky add to cart on mobile. I would like to have it like https://eu.representclo.com/products/team-247-long-sleeve-t-shirt-black

My website: www.auntclothing.com

Let me know if you have a code

Thanks!

[Ritu-25 · Accepted solution]

Hello @Zakariatheguy , 

Add this CSS in base.css

@media(max-width: 479px){
.product-form__submit.button.button--full-width.button--primary {
    bottom: -16px;
    left: -15px;
    position: fixed;
    right: -15px;
    -webkit-transition: width .4s ease,right .4s ease,left .4s ease;
    -o-transition: width .4s ease,right .4s ease,left .4s ease;
    transition: width .4s ease,right .4s ease,left .4s ease;
    width: calc(100% + 30px);
    z-index: 10;
    border-radius: 0px;
}
}

[Zakariatheguy]

Thanks that works. Do you know how to do it like https://eu.representclo.com/products/team-247-long-sleeve-t-shirt-black first its sticky then its fixed and when you scroll further it's sticky again. Just like the example. You have to see it on mobile btw.