Radio Button Alignment

radiobuttonalignment

May I know if there is any quick fix for this button alignment? I am using Perth Pro themes, the responsive theme. No matter how I rescale the size of the windows, the button and the text still remain overlapped.

Thanks in advance.

Hi,

Please post a link to your website, so I can check.

Kind Regards,
Csaba

after adding products into the cart, and you can find it in the shipping options.

Hi,

You can fix that overlap issue with this Custom CSS:

#shipping_method label {
    margin-left: 25px !important;
}

Please add the above CSS to your Child Theme’s style.css or in case you haven’t setup a Child Theme already, then you can also add the CSS to wp-admin -> Appearance -> Customizer -> Additional CSS so you won’t loose the changes after Theme or WordPress updates.

Please let me know how it works.

Kind Regards,
Csaba

1 Like

Thanks Csaba,

I couldn’t find the corresponding Child Theme from Athemes, I assuming I need to create one for my own, right?

Hi,

Yes, you can create a Child Theme easily by using a plugin like this one: https://wordpress.org/plugins/child-theme-configurator/ but if you just do CSS changes you can use wp-admin -> Appearance -> Customizer -> Additional CSS, then the Child Theme isn’t needed.

Kind Regards,
Csaba

1 Like

Hi Csaba,

It works beautifully. thank you so much. May I know how to find the label name for those I need to apply this fix? I have other 2 check box that also have overlap issue.

Hi,

You can fix the checkboxes overlap too with this Custom CSS:

.woocommerce form .form-row .input-checkbox {
    margin: 8px 0 !important;
}

.woocommerce form .form-row .woocommerce-form__label-for-checkbox span {
    margin-left: 18px !important;
}

Please let me know how it works.

Kind Regards,
Csaba

1 Like

awesome, it works! thank you so much.

Hi,

Great! You’re most welcome! If you need help with anything else, please open a new topic.

Have a nice day!

Kind Regards,
Csaba