Можно ли стилизовать checkbox и radio через -webkit-appearance: none и псевдоэлементы?

Question

[Muvka]

Сейчас это работает во всех браузерах, кроме Edge, но там чекбоксы выглядят обычно, т.е. вполне работоспособно и даже размеры принимают. Но меня волнует другое - возможно ли такое, что запретят псевдоэлементы у checkbox и radio? Ведь по сути это наверно баг?
jsfiddle.net/hk0e36zy

Answer 1

[Alams Stoyne]

Я использую псевдоэлементы :before и :after у обертки label а сами checkbox и radio скрываю (активируя через for)

Comments

[Muvka]

Я знаю о такой возможности. Но хочется не использовать дополнительные элементы)

[Alams Stoyne]

Muvka, Очень зря ибо -webkit- не всё поддерживают и порой это просто ломает всю верстку

[Muvka]

Alams Stoyne, У -webkit-appearance поддержка 95.21%. Это отличная поддержка. И вся суть в том, что если браузер не будет поддерживать это свойство, то в нем будет обычный чекбокс - это вполне нормально. Я интересуюсь именно тем, не уберут ли псевдоэлементы у этих инпутов в будущем.

[WapSter]

Muvka, а с чего их убрали то?

[FeST1VaL]

Muvka, все когда то изменится, а вдруг уберут webkit)

[Muvka]

Тимур Турсунбаев, Ну input - это не парный тег по сути. Так? А псевдоэлементы только у парных тегов есть. То, что у чекбокса и radio есть возможность добавить псевдоэлемент - это не баг?

[Muvka]

Артем Будин, Т.е. считаете, что можно вполне спокойно пользоваться? Плюс в том, что по сути сам элемент стилизуется, без каких либо дополнительных тегов. И доступность отличная.

[WapSter]

Muvka, это радикальная мера, спека на такое не пойдет, а если и пойдет то очень долго будет поддерживаться, но постоянно уведомляя. И очень долго, это не меньше двух трёх лет

[Сергей delphinpro]

Тимур Турсунбаев, Радикальная мера убрать псевдоэлементы у инпутов? Так их и сейчас нет в спецификации. Это причуды исключительно хромых браузеров.
Хотя в целом ваша мысль верная, и вряд ли это поведение будет изменено. Скорее наоборот, могут вписать в спеку.

[Muvka]

Сергей delphinpro, Ну я проверил и в Сафари и в FF. Там тоже работают. Или вы про родоначальника?)

[Сергей delphinpro]

Muvka, сафари-то понятно, оба на вебките, а это оттуда. Про FF не знал. Раньше вроде не было. Но Лиса в последнее время много тащит из Хрома, как отстающий браузер.

[Сергей delphinpro]

Кстати, Edge тоже на webkit переходит, так что скорее всего и там скоро будут работать псевдо-элементы у инпутов.

[Muvka]

Сергей delphinpro, Это я знаю. Я боюсь только другого - что вдруг уберут. И придется уйму сайтов править) Я пока еще правда не применял такой метод, но уж больно хочется.

[Сергей delphinpro]

Muvka, не бойтесь =)
Синтаксис псевдоэлементов изначально был определен как :before
Лет 10 назад (точно не знаю) в css3 был изменен на ::before
Но до сих пор браузеры понимают старую нотацию.
Кроме того вспомните устаревшие html-теги — их с десяток, если не больше набертся, у некоторых особое отображение. Но все они работают. И будут работать.
Да, здесь речь идет не об утвержденном и измененном стандарте. Но помимо спецификаций есть еще понятие "Живой стандарт" — это когда фичи нет в спеке, но она внедрена и давно работает во многих браузерах.
Такие вещи никто не будет убирать.

[Muvka]

Сергей delphinpro, Спасибо и вам за ответы!