Estoy trabajando en un componente de reacción y uso datePicker dentro de él para elegir la fecha. Cuando renderizo mi componente DatePicker, muestra un borde negro fuera de mi cuadro de texto y quiero eliminar ese borde.
Aquí está mi componente:
<div className='col'> {translateText('ui.label.message.start.date')} <DatePicker selected={this.props.startDate} placeholder={translateText('Start Date')} onChange={date => this.handleStartDateChange(date)} dateFormat='DD-MM-YYYY' customStyles={{ dateInput: { borderWidth: 0 } }} /> </div> He introducido estilos personalizados para eliminar ese borde, pero no funciona. Aquí hay una instantánea de mi problema: 
Parece que no se ha aplicado css a su archivo de entrada. Podrías arreglar esto como:
.react-datepicker-wrapper input[type="text"]{ border: none; }intente envolver el componente, o pruebe estas opciones que proporciono aquí, la próxima vez escriba la biblioteca exacta que usa.
<div className='col'> {translateText('ui.label.message.start.date')} <div className="customDatePicker"> <DatePicker wrapperClassName="customDatePicker" className="customDatePicker" selected={this.props.startDate} placeholder={translateText('Start Date')} onChange={date => this.handleStartDateChange(date)} dateFormat='DD-MM-YYYY' /> </div> </div>