Issue in dcc.Dropdown

Hi,

PFA, I have create dropdown field by using dash_core_components with large values, but dropdown values are overlapped to each other.

,

How to sort out this.

Please help me.

I have not been able to find a solution that keeps each option on its own line (i.e. disabling word-wrap) other than making the width of the dcc.Dropdown wider so all the text fits. Not the ideal solution but…

You have to make the dropdown component wider. You can use css for it.

Blockquote dcc.Dropdown(
id=‘drop_down’,
options=[],
value=None,
placeholder=’…’,
style={‘width’: ‘300px’}
)

You can provide a style to the dropdown, either use a fixed width or a percentage. More info in the following link: https://codepen.io/chriddyp/pen/bWLwgP?editors=1100