I am trying to change the dropdown content list background color to green in style in Python Dash, i am unable to do so. Can someone help me? I am new to CSS.

dcc.Dropdown(
                        id = 'business_area_dropdown',
                        options=[
                            {'label': 'Academia', 'value': 'academia'},
                            {'label': 'Energy', 'value': 'energy'},
                            {'label': 'Research', 'value': 'research'}
                        ],
                        placeholder="Select Business Area",
                        style = {"background-color":"green"}
                        width = '40%',
                        display = 'inline-block',
                        verticalAlign = "middle"
                        )
                    )

You should specify your css style in a css file inside an assets directory. According to this post, you could create:

  1. an app.py file:
import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash()

app.layout = html.Div(dcc.Dropdown(id = 'business_area_dropdown',
                                   options=[{'label': 'Academia', 'value': 'academia'},
                                            {'label': 'Energy', 'value': 'energy'},
                                            {'label': 'Research', 'value': 'research'}],
                                   placeholder="Select Business Area",),)

if __name__ == "__main__":
    app.run_server()
  1. a directory assets, and a css file style.css inside:
#business_area_dropdown .VirtualizedSelectFocusedOption {
  background-color: green;
  color: white;
}

And you get:

enter image description here

enter image description here