Как убрать стрелочки в input

Как убрать стрелочки в input, которые увеличивают или уменьшают содержимое Вашего поля данных? На самом деле элементарно просто. Эта проблема известна давно, так как браузеры по-своему отображают input, у которых type=»number».

Давайте решим эту проблему прямо сейчас. Заходим в файл стилей Вашего сайта и вписываем туда следующее:

//Это для браузера Chrome:
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
//Это для браузера Firefox:
input[type="number"] {
-moz-appearance: textfield;
}
input[type="number"]:hover,
input[type="number"]:focus {
-moz-appearance: number-input;
}
//Для других
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}

Все, теперь можете обновлять Ваш сайт, удалите тока кэш, не забудьте, и все будет отлично отображаться.

Кстати, также советую Вам ознакомиться и с другими статьями по CSS, которые помогут Вам улучшить работу Ваших ресурсов. Также не забывайте вступать в мои группы Вконтакте, Facebook и подписываться на мой Instagram. Всем спасибо.