Chrome Input type=number CSS Styling (Spinner)

Style Spinner Buttons ด้วย Pseudo-elements

ซ่อน Spinner

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

Style Spinner (แสดงแต่ปรับสไตล์)

input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    background: #f0f0f0;
    border: 1px solid #ccc;
    border-radius: 0 4px 4px 0;
}
input[type=number]::-webkit-inner-spin-button:before {
    content: "▲";
    display: block;
    line-height: 20px;
    text-align: center;
    color: #333;
}

Firefox

input[type=number] { -moz-appearance: textfield; } /* ซ่อน Spinner */

Pseudo-elements เฉพาะ WebKit/Blink (Chrome, Edge, Safari)