cart page

Posted in: Newspaper
Post count: 91

Hi,
1. On my checkout page, the ‘Account Details’ section is overlapping the ‘Order Details’ section (highlighted in green). How can I fix this issue?

2. Also, how can I right-align the sections marked with arrows?

View post on imgur.com

Thank you!

Post count: 91

Hi,

1. The product title is not right-aligned; how can I align it to the right? (I’ve marked it with a red arrow.)

2. Also, the cart total is displayed too close together. How can I make it appear like the demo template? (I’ve marked it with a green arrow.)
It displays correctly on mobile.

3. On mobile, the price and quantity are also shown too close together.
I’ve marked this with a blue arrow.

View post on imgur.com

Thank you!

Post count: 35449

Hi,
Please try this custom css:

.woocommerce form,
body table tr th,
body .td-woo-default form table.shop_table tr td {
text-align: right!important;
}
body.woocommerce-page table.cart td.actions {
text-align: left!important;
}

body .td-woo-default .td-woo-billing {
margin-left: 40px;
margin-right: -30px;
}

I hope this will help you!

Post count: 91

Hi,
1- On the cart page, the product price is displayed in the center.
How can I move it to the left?

2- In the mobile layout, how can I reverse all the elements compared to the demo?
Meaning, how can I make everything display from right to left?

View post on imgur.com

Thank you!

Post count: 35449

Hi,
Can you please provide a link to your website? So I cna create teh css on your site and make sure that it is applied correctly.
Thank you!

Post count: 91

Hi,
Edubit.ir
Thank you.

Post count: 35449

Hi,
Try this custom css:
body .td-woo-default .cart-collaterals .cart_totals table td {
text-align: left;
}
@media (max-width: 768px) {
body .td-woo-default table.cart td.product-name {
text-align: right!important;
}
body .td-woo-default table.cart td.product-thumbnail {
float: right;
}
body .td-woo-default table.cart .product-remove {
left: unset;
right: 5px;
}
body .td-woo-default table.cart td.product-price{
padding: 8px 0 0 0;
}
body .td-woo-default table.cart td.product-name,
body .td-woo-default table.cart td.product-subtotal{
padding-left: 0;
padding-right: 115px;
}
body .td-woo-default table.cart td.product-subtotal {
text-align: left!important;
}
.woocommerce td.product-quantity {
padding-right: 115px!important;
}
}

Viewing 7 posts - 1 through 7 (of 7 total)
The forum ‘Newspaper’ is closed to new topics and replies.