Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

Spinner in html 5 input type

Avatar

Avatar
Validate 10
Level 3
deepakt84913413
Level 3

Likes

6 likes

Total Posts

71 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 1
View profile

Avatar
Validate 10
Level 3
deepakt84913413
Level 3

Likes

6 likes

Total Posts

71 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 1
View profile
deepakt84913413
Level 3

23-02-2018

Whenever i enable HTML 5  input type for numeric component, the numeric pinner like below is also popping up. Can I hide this using the theme editor? or is there any other way to hide this?

1426495_pastedImage_0.png

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Validate 25
Level 5
James_R_Green
Level 5

Likes

47 likes

Total Posts

191 posts

Correct Reply

47 solutions
Top badges earned
Validate 25
Validate 10
Validate 1
Boost 5
Boost 3
View profile

Avatar
Validate 25
Level 5
James_R_Green
Level 5

Likes

47 likes

Total Posts

191 posts

Correct Reply

47 solutions
Top badges earned
Validate 25
Validate 10
Validate 1
Boost 5
Boost 3
View profile
James_R_Green
Level 5

24-02-2018

Hi deepakt84913413

You don't appear to be able to change this in the theme editor as you need to do the following in CSS:

.numericInput input[type=number]::-webkit-inner-spin-button,

.numericInput input[type=number]::-webkit-outer-spin-button {

  -webkit-appearance: none;

  margin: 0;

}

Theme editor caters for the "::before" and "::after" pseudo selectors.

The ::-webkit-inner-spin-button pseudo selector, can't be input into the theme editor as far as I am aware.

Instead you can add the CSS above to a client library and reference that on your form (in addition to your theme). I tested it and this does remove the up and down arrows:

before

Screen Shot 2018-02-24 at 16.38.12.png

after

Screen Shot 2018-02-24 at 16.37.55.png

Thanks,

James

Answers (0)