need to change style of shipping methods on checkout and cart page

The shipping methods are sorted chaotically and I need to change that… The shipping text should be above the shipping methods, then the shipping methods in the left column and the prices in the right column. I am attaching pictures, the first picture shows my website, the second picture shows how it should look.

Attachments:

You must be logged in to view attached files.

Hello,

Can you please share the page URL so I will check and give you a possible solution?

Best Regards

Yeah sorry – nove.zapichy.sk

Hello,

Please add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

/* Align the radio buttons and text in a row */
#shipping_method li {
    display: flex;
    justify-content: space-between;
    align-items: start;
    padding: 5px 0;
}

/* Adjust radio button positioning */
#shipping_method input[type="radio"] {
    margin-right: 20px !important;
}

/* Align text on the left and price on the right */
#shipping_method label {
    flex: 1;
    display: flex;
    justify-content: space-between;
}

Best Regards

not good… i want Doprava(shipping text) on top, then under Doprava i want shipping options, your code make it even worse, also on mobile phone radio button automaticly uncheck after a few seconds. There is image how it is looks like.

Attachments:

You must be logged in to view attached files.

[Author]

Posts