Can't change background color of django form field

I'm trying to change background colors of django form field using widget's attrs like below.

forms.py

class MyForm(forms.Form):
a_filed = forms.EmailField(
    widget=forms.EmailInput(
        attrs={'class':'black-input'}))

It produces an html element in a template with classname 'black-input' as expected.

html

<input type="email" name="email" class="black-input" id="id_email">

Elements with the name 'black-input' should show up with black background color as I set {background-color:black} in my css.

main.css

.black-input{
padding: 5px;
background-color: black;
color: rgba(177, 177, 177, .8);
border: none;
border-radius: 8px;
}

But css doesn't change anything about background color. The weird part is that css changes other attributes of the element (border, border-radius, padding). Of course I checked how the css behaves, and it changed background color of other input elements on the same template with the class name of 'black-input'.

Back to Top