Reply To: Radio button is not shown in Chrome or Safari

02/23/2014 at 1:56 pm #280902
Steven Zahm
Keymaster

@ Global Cultura

Interestingly enough the theme author decided to do this:

select, input, textarea {
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

You can find it right here.

You see this, -webkit-appearance: none;, in Chrome and Safari, they basically hide selects, inputs (like radios and checkboxes) and textareas; globally overriding the browser default. I’m not sure why one would do that. I guess there must a a reason. I suspect this will cause you problems with other plugins that show those fields expecting the global default (being visible).

To fix Form, add the following to the theme’s custom CSS area or to the end of the theme’s styles.css file:

#cn-form h3 input[type="radio"] { -webkit-appearance: radio; }

That’ll fix it.

I do suggest asking the theme author if there will be any adverse effects to the theme if remove the offending CSS from the styles.css to prevent it from causing you issues with other plugins.

Hope that helps.