• Home
  • Whiteboard
  • Online Compilers
  • Practice
  • Articles
  • AI Assistant
  • Jobs
  • Tools
  • Corporate Training
  • Courses
  • Certifications
Login
    • Java
    • JSP
    • iOS
    • HTML
    • Android
    • Python
    • C Programming
    • C++ Programming
    • C#
    • PHP
    • CSS
    • Javascript
    • jQuery
    • SAP
    • SAP HANA
    • Data Structure
    • RDBMS
    • MySQL
    • Mathematics
    • 8085 Microprocessor
    • Operating System
    • Digital Electronics
    • Analysis of Algorithms
    • Mobile Development
    • Front End
    • Web Development
    • Selenium
    • MongoDB
    • Computer Network
    • General Topics
  • Library
  • Courses
  • Certifications
  • Login
  • SQL
  • HTML
  • CSS
  • Javascript
  • Python
  • Java
  • C
  • C++
  • PHP
  • Scala
  • C#
  • Tailwind CSS
  • Node.js
  • MySQL
  • MongoDB
  • PL/SQL
  • Swift
  • Bootstrap
  • R
  • Machine Learning
  • Blockchain
  • Angular
  • React Native
  • Computer Fundamentals
  • Compiler Design
  • Operating System
  • Data Structure and Algorithms
  • Computer Network
  • DBMS
  • Excel
Technical Questions and Answers
  • Data Structure Data Structure
  • Networking Networking
  • RDBMS RDBMS
  • Operating System Operating System
  • Java Java
  • MS Excel MS Excel
  • iOS iOS
  • HTML HTML
  • CSS CSS
  • Android Android
  • Python Python
  • C Programming C Programming
  • C++ C++
  • C# C#
  • MongoDB MongoDB
  • MySQL MySQL
  • Javascript Javascript
  • PHP PHP
  • Selected Reading
  • UPSC IAS Exams Notes
  • Developer's Best Practices
  • Questions and Answers
  • Effective Resume Writing
  • HR Interview Questions
  • Computer Glossary
  • Who is Who

CSS Styling for Chrome Input Type Number

JavascriptWeb DevelopmentFront End Scripts


To style input type = number, use the following CSS −

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

The above shows without a spinner.

To show and style a spinner, use

input[type=number]::-webkit-inner-spin-button {
   opacity: 1;
}

Output

The above shows the following output −

Lakshmi Srinivas
Lakshmi Srinivas

Updated on: 2020-06-25T07:20:05+05:30

1K+ Views

  • Related Articles
  • Styling Tables with CSS
  • Styling Lists with CSS
  • Style input type reset with CSS
  • Style input type button with CSS
  • How to Remove Arrow on Input Type Number with Tailwind CSS?
  • What is styling text input caret ?
  • Styling Links Working with CSS
  • Styling Tables Working with CSS
  • HTML5 Input type “number” in Firefox
  • HTML DOM Input Number type Property
  • Styling Forms with CSS Attribute Selectors
  • Essential CSS Properties for Styling Tables
  • HTML5 Input type=number removes leading zero
  • Make HTML5 input type=“number” accepting dashes
  • Styling First-Letters with CSS ::first-letter
Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements
TOP TUTORIALS
  • Python Tutorial
  • Java Tutorial
  • C++ Tutorial
  • C Programming Tutorial
  • C# Tutorial
  • PHP Tutorial
  • R Tutorial
  • HTML Tutorial
  • CSS Tutorial
  • JavaScript Tutorial
  • SQL Tutorial
TRENDING TECHNOLOGIES
  • Cloud Computing Tutorial
  • Amazon Web Services Tutorial
  • Microsoft Azure Tutorial
  • Git Tutorial
  • Ethical Hacking Tutorial
  • Docker Tutorial
  • Kubernetes Tutorial
  • DSA Tutorial
  • Spring Boot Tutorial
  • SDLC Tutorial
  • Unix Tutorial
CERTIFICATIONS
  • Business Analytics Certification
  • Java & Spring Boot Advanced Certification
  • Data Science Advanced Certification
  • Cloud Computing And DevOps
  • Advanced Certification In Business Analytics
  • Artificial Intelligence And Machine Learning
  • DevOps Certification
  • Game Development Certification
  • Front-End Developer Certification
  • AWS Certification Training
  • Python Programming Certification
COMPILERS & EDITORS
  • Online Java Compiler
  • Online Python Compiler
  • Online Golang Compiler
  • Online C Compiler
  • Online C++ Compiler
  • Online C# Compiler
  • Online PHP Compiler
  • Online MATLAB Compiler
  • Online Bash Compiler
  • Online SQL Compiler
  • Online Html Editor
  • ABOUT US |
  • OUR TEAM |
  • CAREERS |
  • JOBS |
  • CONTACT US |
  • TERMS OF USE |
  • PRIVACY POLICY |
  • REFUND POLICY |
  • COOKIES POLICY |
  • FAQ'S
tutorials point logo

Tutorials Point is a leading Ed Tech company striving to provide the best learning material on technical and non-technical subjects.

© Copyright 2025. All Rights Reserved.