Search code examples
csscss-cascade

Is there a way to override a CSS rule to essentially negate it?

If I have a classic.css file that I want to override (in this case it's from the Sphinx documentation used for Python: https://docs.python.org/2.7/_static/classic.css ) and essentially "undo" a rule, is there a way to do that?

In this case there are these rules:

div.sphinxsidebar h3 {
    font-family: 'Trebuchet MS', sans-serif;
    color: #ffffff;
    font-size: 1.4em;
    font-weight: normal;
    margin: 0;
    padding: 0;
}

div.sphinxsidebar h4 {
    font-family: 'Trebuchet MS', sans-serif;
    color: #ffffff;
    font-size: 1.3em;
    font-weight: normal;
    margin: 5px 0 0 0;
    padding: 0;
}

What I want to do is something like

div.sphinxsidebar h3,
div.sphinxsidebar h4
{
   font-family: [revert-to-auto];
   color: [revert-to-auto];
}

so I can specify the font-family and color in body and have it apply everywhere without having to use !important.

Just to clarify: I have my custom.css which starts with @import(classic.css); as per the Sphinx documentation, rather than the usual use of two <link rel="stylesheet" type="text/css"> elements in the <head> section.

Solution

  • The CSS keyword inherit is usable for any property, and its function is to set the property to the value of the parent element.