Manage font size of dropdown menu items

Dash Python
1

How do I change the font size of dropdown menu items?

dbc.InputGroup(
               [
                   dbc.InputGroupAddon("Address"),
                   dcc.Input(id='address_autocomplete', style={'width':'76%'}),
                   dcc.Dropdown(id='address_dropdown',
                                placeholder="Address Suggestions",
                                style={'width':'100%', 'display':'inline-block'})
               ],
               style={'margin-top':'30px', 'width': '53%', 'float': 'left'},
           ),

Screenshot 2020-07-19 at 9.27.12 PM

2

Hi @keval

Try adding something like 'font-size' : '85%' to the
style={'width':'100%', 'display':'inline-block'}

3

You could either:

Change the css property in a stylesheet:

style.css

.Select-menu-outer {
    font-size: 10px;
}

or increase the optionHeight value (the default is 35px):

dcc.Dropdown(id="my-dropdown", optionHeight=55, ...)
1 Like