13
Views
6
Comments
Solved
How to display arrow in input type number for reactive website?
Question
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.


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

mvp_badge
MVP
Rank: #2

Hi Syakir,

What "arrow" do you mean?

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