2

I'm using dark theme for XFCE and along with the DE the default css of firefox has changed. I tried to fix it by creating file ~/.mozilla/firefox/chrome/userContent.css and pasting in some css - it kind of worked but there is still plenty of elements that don't display properly (eg. dropdown menus, radio buttons, checkboxes, ...). Even thou these elements are included in my custom css. The problem is not caused by my css being overridden by website's css. So is there a way to fix this?

My userContent.css:

    input {
    border: 2px inset white;
    background-color: white;
    color: black;
}

textarea {
    border: 2px inset white;
    background-color: white;
    color: black;
}

select {
    border: 2px inset white;
    background-color: white;
    color: black;
}

input[type="radio"],
input[type="checkbox"] {
    border: 2px inset white ! important;
    background-color: white ! important;
    color: ThreeDFace ! important;
}

*|*::-moz-radio {
    background-color: white;
}

button, 
input[type="reset"],
input[type="button"],
input[type="submit"] { 
    border: 2px outset white;
    background-color: #eeeeee;
    color: black;
}

body {
    background-color: white;
    color: black;
    display: block;
    margin: 8px;
}

Examples of black elaments:

some random website google forms "add image" dialog on askubuntu.com

3

You need to add -moz-appearance: none; to all your CSS rules.

If that alone doesn't make it, you'll have to add a fix to your gtk-2.0 theme. Check the answer for: How to fix firefox's look with a dark theme?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.