Return to previous page

Radio buttons look different on ios devices

This topic has 6 replies, 2 voices, and was last updated 2 years, 3 months ago ago by Rose Tyler

ziga32

Participant

August 16, 2022 at 15:45

Can you guess what this is?
https://i.imgur.com/0GHTKsR.png

#331900 Copied Theme version: 8.1.1 WooCommerce version: 6.3.1

5 Answers

Rose Tyler

Support staff

August 16, 2022 at 15:56

Hello,

What version of Safari browser do you use? What exactly device?

Regards

#331902 Copied

ziga32

Participant

August 16, 2022 at 16:04

iphone 13 pro on chrome browser

#331905 Copied

Rose Tyler

Support staff

August 17, 2022 at 09:51

Hello,

Add the next code in Theme Options > Theme custom CSS:

#payment .payment_methods input[type=radio]:not(:only-child), 
#shipping_method input[type=radio]:not(:only-child) {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    visibility: hidden;
}
#payment .payment_methods input[type=radio]:not(:only-child) + label:before, 
#shipping_method input[type=radio]:not(:only-child) + label:before {
    content: '';
    width: 1rem;
    height: 1rem;
    display: inline-block;
    border-radius: 50%;
    box-shadow: 0px 0px 1px 1px #ccc;
    margin-inline-end: 7px;
    vertical-align: -1px;
}
#payment .payment_methods input[type=radio]:not(:only-child):checked + label:before, 
#shipping_method input[type=radio]:not(:only-child):checked + label:before {
    background: #000;
    border: 4px solid #fff;
}

Regards

#331947 Copied

ziga32

Participant

August 17, 2022 at 10:43

works perfect, thank you!

#331956 Copied

Rose Tyler

Support staff

August 17, 2022 at 10:53

You’re welcome!

Regards

#331958 Copied

Tagged: buttons, radio, style, templates, woocommerce, wordpress
Viewing 6 results - 1 through 6 (of 6 total)

The issue related to '‘radio buttons look different on ios devices’' has been successfully resolved, and the topic is now closed for further responses

Radio buttons look different on ios devices

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection