Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

179
Views
React Select Overlaps With Label

I am using react-select ^5.1.0 and my options and values are displayed well. I have a small issue when scrolling the options, a select word overlapps the options. I have attached an image that can explain better. What can i do to remove the select word on my options? It blocks them.

My code :

const methods = useForm();

<label> Line Manager : </label>
   <Controller
     control={methods.control}
     className="basic-single"
     classNamePrefix="select"
     styles={{ marginTop : '10px', marginBottom : '10px'}}
     name="line_manager"
      render={({ value, ref }) => (
       <Select
         inputRef={ref}
         options={items}
         className="basic-multi-select"
         value={items.find(c => c.fullnames === value)}
         onChange={val => setLineManager(val.id)}
         getOptionLabel={items => items.fullnames}
         getOptionValue={items => items.id}
       />
     )}
  />

my select

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Looks like the label on those select boxes have a higher z-index than that of the options box. Ideally, you need to increase the z-index of the options overlay.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!