Радио кнопки отображаются в Safari как чекбоксы

332
13 февраля 2017, 15:54

Есть форма, в которой имеются радио кнопки. Эти радио кнопки на мобильном сафари отображаются как чекбоксы (а выбранные радио кнопки отображаются как маленькие и не выбранные) (см. скриншот).

Единственное, что нашёл в интернете это свойство -webkit-appearance: radio, но оно никак не помогло

Как я понял, сам сафари переопределяет стили этих кнопок на свои, вопрос в том как их отключить или переопределить на нормальные?

UPD: пример кнопки

<input type="radio" name="customer" value="1" checked="checked">

Стилей почти никакх нет, кроме высоты/ширины и позиционирования

Answer 1

Сперва нужно обнулит стили:

input, textarea, button {
    -webkit-appearance: none;
    -webkit-font-smoothing: antialiased;
    resize: none;
}

А после мы задаем новые:

input[type="radio"]{
    -webkit-appearance: radio;
}
READ ALSO
скрыть блоки CSS
CSS

скрыть блоки CSS

 451
Как нарисовать знак &ldquo;Х&rdquo; с помощью SVG и CSS?
CSS

Как нарисовать знак “Х” с помощью SVG и CSS?

Мне нужно создать анимацию знака "Х" для отказа от действий

 407
SVG - анимация из средней точки на всю ширину
CSS

SVG - анимация из средней точки на всю ширину

У меня есть логотип в SVG, который я хочу анимироватьУ него есть средняя часть, которая останется фиксированной, но боковые стороны логотипа...

 511
Работа функции std::basic_istream::get
c++

Работа функции std::basic_istream::get

У меня есть файл с последовательностью int чиселНеобходимо в цикле считывать по одному числу, чтобы проводить с ним манипуляции

 344