# How can I change the size of dcc.DatePickerSingle and dbc.DropdownMenu using css?

**URL:** <https://community.plotly.com/t/how-can-i-change-the-size-of-dcc-datepickersingle-and-dbc-dropdownmenu-using-css/73855>\
**Category:** Dash Python\
**Created:** [March 24, 2023, 12:09pm UTC](https://community.plotly.com/t/how-can-i-change-the-size-of-dcc-datepickersingle-and-dbc-dropdownmenu-using-css/73855 "2023-03-24T12:09:45Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![jun1.lee](https://avatars.discourse-cdn.com/v4/letter/j/8dc957/32.png) [@jun1.lee](https://community.plotly.com/u/jun1.lee)\
**Post date:** [March 24, 2023, 12:09pm UTC](https://community.plotly.com/t/how-can-i-change-the-size-of-dcc-datepickersingle-and-dbc-dropdownmenu-using-css/73855/1 "2023-03-24T12:09:45Z")

</div>

How can I change the size, fontsize of dcc.DatePickerSingle and dbc.DropdownMenu using css?  
I tried several ways by modifying the css, but the size is not reflected at all.  
Below is my python, css.

```auto
dcc.DatePickerSingle(
                className = 'datepicker',
                id='my-date-picker-single',
                min_date_allowed=date(1995, 8, 5),
                max_date_allowed=date(2017, 9, 19),
                initial_visible_month=date(2017, 8, 5),
                date=date(2017, 8, 25)
            )

html.Div(children=[
            dbc.DropdownMenu(id='parent-drop', children=[
                dcc.Checklist(id='check')
            ], label='menu'),
            dcc.Dropdown(id='drop')
        ])

.datepicker{
    font-size: 2px;
    height: 50%;
    width: 5px;
}

#parent-drop{
    font-size: 2px;
    height: 50%;
    width: 5px;    
}

```