- Forums
 - ionic
 - Ionic React CSS Example To Remove The Up and Down Arrows in a Input Number Field
 
use this css code to force remove the up and down arrows that show up in a form input field that is the number type. [5216], Last Updated: Mon Jun 24, 2024 
 
 ionic
 Fri Sep 29, 2023 
 0 Comments
 2061 Visits
Developing an app and want to hide the up and down arrows in your browser?
This is a CSS example code that was used for an IONIC React application, it works.
/* NOT FIREFOX: Safari, Chrome, Edge, Opera */
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
},
input::-webkit-outer-spin-button,
 
/* Firefox ONLY */
input[type="number"] {
  -moz-appearance: textfield;
}
// Resource: https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp