Answers for "input type=number custom arrows css"

CSS
1

html css number input field don't show arrows

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}
Posted by: Guest on March-17-2021
0

style input number arrows

.number-wrapper {
  position: relative;
}

.number-wrapper:after,
.number-wrapper:before {
  position: absolute;
  right: 5px;
  width: 1.6em;
  height: .9em;
  font-size: 10px;
  pointer-events: none;
  background: #fff;
}

.number-wrapper:after {
  color: blue;
  content: "25B2";
  margin-top: 1px;
}

.number-wrapper:before {
  color: red;
  content: "25BC";
  margin-bottom: 5px;
  bottom: -.5em;
}
Posted by: Guest on November-01-2021

Browse Popular Code Answers by Language