Checkout page shipping options are malpositioned

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!

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

Yes sure!

http://paulspetcity.com/checkout/

Thank you very much!

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

Hi there!

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

Regards,

Max

Hi Max,

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

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

Regards,
Kharis
aThemes Support

Hi Kharis! ,

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

Regards Max

Shipping is location based

Use as sample adres

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

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