Tengo una lista desplegable que se puede buscar en mi componente de reacción. No he usado ningún css para ello. pero está cubriendo el último carácter cuando estoy escribiendo. Cuando verifiqué que es una bóveda de extensión. No soy capaz de quitarlo. ¿Cómo puedo eliminarlo en mi código?. Quiero decir, ¿hay algún css que pueda sobrescribirlo? como S está cubierto. He marcado en red si escribo el siguiente carácter, estará cubierto

Cuando hice clic en ese carácter e inspeccioné debajo de css , pero después de muchas permutaciones no pude resolverlo.

este es mi código para Select la importación de componentes Seleccionar de "reaccionar-seleccionar";

 <Select id="sponsor" name="sponsor" className="form-control" placeholder="Select the sponsor" options={result.map((sponsor:Sponsor)=> ({ label: sponsor.name, value: sponsor.id }) )} onChange={ (sponsorId:any,e:any)=>{ setFieldValue("sponsor",sponsorId.value) result.map((sponsor:Sponsor)=>{ if(sponsorId.value===sponsor.id){ setFieldValue("address",sponsor.address); setFieldValue("address2",sponsor.address2); setFieldValue("zipCode",sponsor.zipCode); setFieldValue("city",sponsor.city); setFieldValue("sponsor",sponsor.name) } }) }} />