Styling Help - Remove Default Borders

Date and time pickers
1

Does anyone know how to remove these two borders? They appear above and below the Datepicker element.

Using React:

   <Datepicker
        select="range"
        rangeHighlight={true}
        showRangeLabels={true}
        rangeStartLabel="Depart"
        rangeEndLabel="Return"
        dateFormat="YYYY-MM-DD"
        themeVariant="light"
        display="inline"
        onChange={ handleDatepickerOnChange }
      />

Decisions%20%26%20Calendar%20Events
Decisions%20%26%20Calendar%20Events960×540 66.4 KB

2

Hi @Dan_Shevenell :wave:

You can remove those borders with CSS.

3

Thanks — could you at least link to relevant documentation? I’ve tried a few things (e.g., wrapping in a Div with no border), but none have worked.

4

We don’t have separate docs for custom CSS. But, you can use the inspect elements and find the related part and modify the CSS.