Resetting the style on elements with inherited style

I have one <div> and I don't wish to inherit any formatting from any other stylesheets 开发者_StackOverflow- I want to start fresh with this <div>. How can I do it?

i don't know any solution except explicit resetting of all styles for this div.

you cannot reset inheritance of css styles. To start from fresh you must design your style sheet to prevent undesirable inheritance, this is the only way except overriding styles.

Use something like firebug or IE developer toolbar to get a list of all styles applied to the div, and manually reset them all, unfortunatly.

I'm not sure you can do a general inheritance override, though it would be nice if there was support for such a thing.

You do have a few options though...

You could define your own style and use !important at the end of each statement (not exactly fun).

div.myspecialdiv
{
  padding:10px !important;
  margin:0 auto !important;
  font-size:12px !important;
  font-family:Arial !important;
  font-weight:normal !important;
  /* and etc. */
}

Or you could also try using auto.

Here is an example:

div.myspecialdiv
{
  padding:auto;
  margin:auto;
  background:auto;
  font-size:auto;
  font-family:auto;
  font-weight:auto;
  /* and etc. */
}

You can read more about it here: http://www.michaelhamrah.com/blog/2009/02/wiping-out-inherited-css-styles/

I found that you if you know the faulty CSS Class, you can use an inline <Style> block to override that particular style set.

For example, in my issue, a third party tool had a style .RadComboBoxDropDown Input to set the style on all input controls. However, this was causing issues with the margins, so I was able to add the following inline style block directly above the point it was used, using the exact same css class name as the faulty third party css class.

 <style>
        .RadComboBoxDropDown input
        {
            margin: 0px !important;
        }
 </style>

I only tested this in Chrome, but it showed the new class applied and the styles resumed their proper layout.

One caveat, once you change the css class, it will apply that new style through the entire page from that point forward.