Solved

Cart Page | Change and fix

ChicBotique1
Tourist
31 0 3

Hello everyone,

 

i have set my website to be RTL (right to left)

and my cart page is not working correctly, and i want to fix the position of the following :

 

Screenshot 2024-03-27 151913.png

and also instead of the following design :

Screenshot 2024-03-27 152201.png

 

to this design :

Screenshot 2024-03-27 152223.png

 

Thanks in advance 🙂

 

Accepted Solution (1)

theycallmemakka
Shopify Partner
1336 295 328

This is an accepted solution.

Hi @ChicBotique1 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

<style>
@media only screen and (min-width: 750px) {
  tr th.caption-with-letter-spacing {
        text-align: right;
    }
    .cart-items *.right {
        text-align: left;
        padding-left: 0px;
    }
    
    tr {}
    
    main#MainContent {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .cart-item>td+td {
        padding-right: 1rem;
        padding-left: 0px;
    }
    td.cart-item__quantity {
    padding-left: 0rem!important;
}
    
}
.totals {
        align-items: center;
        justify-content: space-between;
    }
</style>

Result:

theycallmemakka_0-1711559963437.png

 

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

 

Best Regards,
Makka

Buy me a Coffee


Enjoy Shopify for $1. Sign up now


For quick response - Message Me


Ping me at: theycallmemakka@gmail.com

View solution in original post

Replies 2 (2)

theycallmemakka
Shopify Partner
1336 295 328

This is an accepted solution.

Hi @ChicBotique1 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

<style>
@media only screen and (min-width: 750px) {
  tr th.caption-with-letter-spacing {
        text-align: right;
    }
    .cart-items *.right {
        text-align: left;
        padding-left: 0px;
    }
    
    tr {}
    
    main#MainContent {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .cart-item>td+td {
        padding-right: 1rem;
        padding-left: 0px;
    }
    td.cart-item__quantity {
    padding-left: 0rem!important;
}
    
}
.totals {
        align-items: center;
        justify-content: space-between;
    }
</style>

Result:

theycallmemakka_0-1711559963437.png

 

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

 

Best Regards,
Makka

Buy me a Coffee


Enjoy Shopify for $1. Sign up now


For quick response - Message Me


Ping me at: theycallmemakka@gmail.com

ChicBotique1
Tourist
31 0 3

thank you so much brother!!