Checkout page shipping options are malpositioned

Leto
#1

Hey guys. I’ve got some problems with my checkout page. After clicking the PROCEED TO CHECKOUT button, shipping options shown on the right order total bar are malpositioned. One check circle runs to the right and the other one remains on the left. Please see the snapshot below.

image

I want to keep my shipping options aligned and well organized, with all bullet points and check circles placed on the left followed by the text.

How can I fix this problem? Thank you. Your help would be appreciated!

#2

Hi,

Thank you for contacting us. I am happy to help with your queries.

Can you share a link to your checkout page, so I can try and inspect the problem directly. So I can help you in a better way.

Regards,
Kharis
aThemes Support

#3

Yes sure!

http://paulspetcity.com/checkout/

Thank you very much!

#4

Hi,

Thank you for sharing the link.

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    .woocommerce-checkout-review-order-table tr.shipping td {
      min-width: 50%;
      text-aling: left;
    }

    #shipping_method {
    	 padding-left: 0;
    	 margin-left: 0;
    	 list-style: none;
    }
     #shipping_method input.shipping_method {
    	 float: left;
    }
     #shipping_method label {
    	 display: inline;
    }

Regards,
Kharis
aThemes Support

#5

Hi there!

I am having the same issue. The given CSS does’nt work for me.
https://www.blendsome.nl/afrekenen/

image
image1869×695 53.6 KB

Regards,

Max

#6

Hi Max,

I tested your checkout page and the shipping option seems not active on the product I am testing.

Screen Shot 2021-03-13 at 07.16.17
Screen Shot 2021-03-13 at 07.16.17476×557 20.8 KB

Can you link the product I can test to get the issue needing to resolve?

Regards,
Kharis
aThemes Support

#7

Hi Kharis! ,

You can use the next linkt for the product: https://www.blendsome.nl/product/natural-base-100ml/

Regards Max

#8

Shipping is location based

Use as sample adres

Street 1 (Adres)
Heerlen (Plaats)
0000AC (Postcode)

#9

Hi,

Thank you for sharing the checkout details.

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    .woocommerce-checkout-review-order-table tr.shipping td {
      min-width: 50%;
      text-aling: left;
    }

    #shipping_method {
    	 padding-left: 0;
    	 margin-left: 0;
    	 list-style: none;
    }
     #shipping_method input.shipping_method {
    	 float: left;
    }
     #shipping_method label {
    	 display: inline;
    }

Regards,
Kharis
aThemes Support