How can override a CSS class to that nothing get applied?

What I am actually trying to say and sorry if the title if weired is that I have a framework (Richfaces) that is applying it's own style. I have an company CSS and I am not a CSS expert all I need is to override the css coming from richfaces so that nothing gets applied over what is in the corporate CSS.

Here is the CSS coming from richfaces that I do not want to be applied:

*.rf-dt-hdr-c {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #C4C0C9;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #C4C0C9;
    background-color: #D4CFC7;
    background-image: url(/rfRes/colHdrGrad.png.xhtml?v=4.0.0.Final&db=eAFjZJBjZDBiZBBh!H!!zlXG!1fOH2dgAgA4fAdk&ln=org.richfaces.images);
    background-position: top left;
    color: #000000;
    font-family: Arial, Verdana, sans-serif ;
    font-size: 11px;
    font-weight: bold;
    padding: 4px;
    text-align: center;
}

Solution

In order to override this, you can just reset every rule to what you would prefer and make sure that your corporate CSS appears lower down in the link order. (That is, have your corporate styles applied last.)

For example, if you redo every style according to your needs in your CSS, you should link them like this

<link rel="stylesheet" type="text/css" href="Styles/richface.css" />
<link rel="stylesheet" type="text/css" href="Styles/corporate.css" />

If the styles are the same, the one that appears lower/later in the order will be applied (because it will overwrite the former).

Really, for your styles to override the others, your CSS needs to be more specific than the other CSS.

So, you could also set the elements to be more specific.

Instead of

*.rf-dt-hdr-c {

make it something like

div#wrapper div.rf-dt-hdr-c {

which increases the specificity. Of course, the rules would need to match your HTML.

For more on specificity, see this: http://www.htmldog.com/guides/cssadvanced/specificity/