How can I override inline style using external css?

Question

I am trying to restore a table created by an asp.net gridview control. The problem is that gridview creates inline styles. How to make the browser display my css and not the html style attribute?

Answer 1

You can try it ! important in your CSS file.

Answer 2

You can use! important; but this does not work in all browsers.

Here's an article about using the important .

Answer 3

You can try adding “! Important” to your CSS style definitions as per this article or follow Ryan Lansio’s previous suggestion

Answer 4

According to the CSS specification, element selectors have a specificity of 1, class selectors have a specificity of 10, ID selectors have a specificity of 100, and a specificity of inline styles is 1000. A higher specificity will override a lower specificity, so inline styles always win. However, there is a way out. Announcement ! Important redefines all non-essential declarations. No matter what is the source of the style, he will lose something with the ad ! Important

Source: CSS Web Design by Eric A. Meyer.

Answer 5

I think you will need to override the style using JavaScript. jQuery will make this very simple.

Answer 6

You can take a look at this: http://justgeeks.blogspot.com/2008/09/override-any-css-style-even-inline.html . Use a modifier! Important for this to happen.

Answer 7

Do you use themes? Themes create inline styles. To get rid of them, you can disable the theme for gridview:

<asp:GridView EnableTheming="false" ... /> 

Answer 8

Unfortunately, inline CSS is always the last style applied to an element, so inline styles will always override external styles.

If the generated Gridview styles give you the fit, take a look at the ASP.NET CSS responsive controls ( http://www.asp.net/CssAdapters/ ). This is a great project.

Answer 9

An Inline style takes precedence over external styles. This cannot be overridden if you are not using ! Important.