How to change colors of ChoiceFields options within the drop down menu when mouse is over
The form uses crispy forms which implements bootstrap. I tried using '!important' and specifics the widget of choicefield to have an attribute of a class which I can reference in my stylesheet:
<form id="gene_form" action ="http://127.0.0.1:8000/checkqueries/", method="get", novalidate> {{ gene_form|crispy }}
my forms.py:
select_cancer = forms.ChoiceField(label = 'Cancer', choices = ExtractCancer(), required=False, widget=forms.Select(attrs={'class':'boostrap-select'}))
my css
.boostrap-select { background-color: black; color: white; }
select option { background-color: blue; color: white; }
.boostrap select changes the color of the box but not of the options dropdown menu. How can I change this to be able to allow the user to hover over an option in the drop down and then my own css colors will take over?
I have tried referencing the class in the css and this works for the box but not for the options. I have also tried changing the css for any select option html found in the page but this hasn't worked either. I am using Django framework if that makes a difference.