How can I style react-datepicker?

From https://github.com/Hacker0x01/react-datepicker/issues/2099#issuecomment-704194903

Try with wrapperClassName property:

<DatePicker wrapperClassName="datePicker" dateFormat="dd/MM/yyyy" />

CSS:

.datePicker {
  width: 100%;
}

This way you won’t modify the styles for the whole app

styled-components bonus:

import React from 'react';
import styled, { css, createGlobalStyle } from 'styled-components';
import DatePicker from 'react-datepicker';

const DatePickerWrapperStyles = createGlobalStyle`
    .date_picker.full-width {
        width: 100%;
    }
`;

<>
  <DatePicker wrapperClassName="date_picker full-width" />
  <DatePickerWrapperStyles />
</>