Checkout page is not well arranged on desktop devices

Leto
#1

The arrangement is perfect on mobile devices but there’s this weird arrangement on pc
Please help

leto error
leto error908×640 61 KB

#2

Hi,

Can you please share a link to your cart page, so I can inspect the issue further and find out the possible solution to suggest?

Regards,
Kharis
aThemes Support

#3

Thank you for your reply. Here’s a link https://bitly.lk/824DG

I managed to make it look better by increasing the width of the cart totals to 100% using css

leto 2
leto 21216×526 40.3 KB

However, there is no sidebar anymore, it got moved down below the checkout. I don’t know if you could help with a better solution

#4

Can you share the added code? Perhaps it needs a little revisions?

Regards,
Kharis
aThemes Support

#5 
    .col-md-9 {
      width: 100% !important;
    }

Here it is

#6

Hi,

Thank you for sharing the code.

Please try replacing it with:

    @media only screen and (min-width: 992px) {
      .woocommerce-cart #primary.col-md-9 .woocommerce .woocommerce-cart-form {
        width: 100%;
      }  
    }

Regards,
Kharis
aThemes Support

1 Like
#7

Hello, thank you it worked! but it is aligned to the right. Visitors may find it hard seeing it

leto 3
leto 31055×633 88.7 KB

#8

I fixed it with css. I added this

    .woocommerce-cart .woocommerce .cart-collaterals {
       width: 100% !important;
    }

And it looks like this now

leto 4
leto 41096×626 91.6 KB

Thank you so much for your help. I really think Leto is the best free theme out there

1 Like
#9

Hi,

Glad to know you were able to add some corrections.

You’re welcome!

You may want to share your experience with a 5-star rating here to let other know how great our theme is. I really appreciate if you do so.

Regards,
Kharis
aThemes Support

#10

Sure, I rated it 5 stars already

1 Like