Tuesday, May 14, 2024
Homepage · reactjs
 Popular · Latest · Hot · Upcoming
18
rated 0 times [  22] [ 4]  / answers: 1 / hits: 9164  / 4 Years ago, tue, october 13, 2020, 12:00:00

I am using from react-select but I am not able to remove spinners/arrows from the dropdown.


The


I am able to remove the default separator | and Dropdown Indicator using


<Select

  components={{

    IndicatorSeparator: () => null, DropdownIndicator: () => null

  }}

  {...}

/>

But how can I get rid of these arrows?


More From » reactjs
 Answers
2

I believe you're setting the type=number for the input element somewhere. In order to remove the up/down arrow. you can use the css code from this tutorial.


You can also see all of the input types and how it's rendered out-of-the-box here.


/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,

input::-webkit-inner-spin-button {

  -webkit-appearance: none;

  margin: 0;

}



/* Firefox */

input[type=number] {

  -moz-appearance: textfield;

}

Live Demo


Edit


[#2496] Friday, October 9, 2020, 4 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
kylanalis
Add To Favorites
Follow
Total Points: 438
Total Questions: 85
Total Answers: 102
Location: Barbados
Member since Sun, Nov 27, 2022
1 Year ago
kylanalis questions
Sat, Oct 2, 21, 00:00, 3 Years ago
Sat, Apr 11, 20, 00:00, 4 Years ago
Thu, Feb 13, 20, 00:00, 4 Years ago
Tue, Jan 7, 20, 00:00, 4 Years ago
Thu, Jan 2, 20, 00:00, 4 Years ago
View All
;