How to make sticky add to cart studio them

Solved

How to make sticky add to cart studio them

Zakariatheguy
Excursionist
52 0 9

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!

Accepted Solution (1)

Ritu-25
Shopify Partner
129 26 15

This is an 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;
}
}

 

If helpful then please Like and Accept Solution.
You can directly PM.
Email Me : nayakritu.2506@gmail.com

View solution in original post

Replies 2 (2)

Ritu-25
Shopify Partner
129 26 15

This is an 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;
}
}

 

If helpful then please Like and Accept Solution.
You can directly PM.
Email Me : nayakritu.2506@gmail.com
Zakariatheguy
Excursionist
52 0 9

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.