Change Margins/Padding in Cart

Site URL: https://boxfreshcreative.com

Hi,

I was wondering if there was a way to edit the margin/padding on the cart page to bring the content in as i don't want it the full length of the page and also its very close to the footer, i tried a code to edit the padding on the bottom of the container but it did it site wide and thats not what i need.

TIA

@BoxfreshCreative Hi! You can add this code under Website > Pages > Website Tools > Custom CSS

@media screen and (min-width: 992px) {
    #sqs-cart-container {
        padding-top: 40px;
        padding-left: 100px;
        padding-right: 100px;
        padding-bottom: 60px;
    }
}

@media screen and (max-width: 991px) {
    #sqs-cart-container {
        padding-top: 40px;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 60px;
    }
}

2 hours ago, Lesum said:

@BoxfreshCreative Hi! You can add this code under Website > Pages > Website Tools > Custom CSS

@media screen and (min-width: 992px) {
    #sqs-cart-container {
        padding-top: 40px;
        padding-left: 100px;
        padding-right: 100px;
        padding-bottom: 60px;
    }
}

@media screen and (max-width: 991px) {
    #sqs-cart-container {
        padding-top: 40px;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 60px;
    }
}

 

That worked perfectly thanks, one more thing any idea how i shrink the size of the Checkout button? its far to long

@BoxfreshCreative You can add this code to reduce the width of the Checkout button. 

#cart .cart-checkout {
    display: flex !important;
    justify-content: flex-end;
    align-items: flex-end;
}

#cart .sqs-button-element--primary.cart-checkout-button {
    max-width: 150px;
}