If you make a input type as Number then webkit browsers such as Chrome, Safari will make an ugly spinner button. It is useful at times but visual point of view it’s very ugly. Use following CSS to override webkit browser’s CSS.
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
/* display: none; <- Crashes Chrome on hover */
-webkit-appearance: none;
margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
Subscribe to our mailing list
Subscribe to our mailing list and receive a free udpates
What is this “ugly spiiner” – can you show a screen shot please?
oops correction : //“ugly spiiner”// –> “ugly spinner”
Create a text input as blow and check it out in Chrome browser 🙂
//Create a text input // What does this mean or where do you put this code? in HTML ? Can you point to a site using this where we can see the “ugly spinner button” or a screen shot showing “ugly spinner button” ? My question was to find what it is and not how it is generated!
Check this out