Syakir
Rank: #3623
13Views
6Comments
Solved
How to display arrow in input type number for reactive website?
Question
Reactive
Application Type
Reactive

Hi, i wanted to show the arrow in my input (input type - numbers) for reactive web. How can I achieve this? Thank you in advance! 

Below I attach screenshot for my current input.


0
0
on 2020-11-20
Copy link to comment
Benjith Sam
mvp_badge
MVP
Rank: #78
Solution

Hi Syakir,

For the mentioned objective, try to define the below mentioned CSS definition in the Screen Scope or the module Scope (Style Sheet section)

[data-input][type="number"]::-webkit-inner-spin-button, 
[data-input][type="number"]::-webkit-outer-spin-button {  
   -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}

See this sample app-NumberInputTask

Note: Make sure that the Input widget Type is Number

Hope this helps you!


Kind regards,

Benjith Sam

See solution in context
0
0
on 2020-11-20
Copy link to comment
Kilian Hekhuis
mvp_badge
MVP
Rank: #2

Hi Syakir,

What "arrow" do you mean?

0
0
on 2020-11-20
Copy link to comment
Benjith Sam
mvp_badge
MVP
Rank: #78
Solution

Hi Syakir,

For the mentioned objective, try to define the below mentioned CSS definition in the Screen Scope or the module Scope (Style Sheet section)

[data-input][type="number"]::-webkit-inner-spin-button, 
[data-input][type="number"]::-webkit-outer-spin-button {  
   -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}

See this sample app-NumberInputTask

Note: Make sure that the Input widget Type is Number

Hope this helps you!


Kind regards,

Benjith Sam

0
0
on 2020-11-20
Copy link to comment