GridView and style 1

[seaport]

I just started to use asp.net 2.0 and added a GridView in a page. Although I set the property of the GridView header, the format of the header did not change at all. I spent two hours and evetually figured out why. When .net 2.0 rendered the page, the header of the GridView was put into "<th>" tag. I happened to have "<th>" defined in the CSS file, but I never used it.

So I deleted the "<th>" from the CSS file and then the format of GridView took effect.

It seems that formating defined by style overwrites formating defined through the property sheet of the control.

Could anyone provides me some documentation on this?

Thanks in advance.

Seaport

 

[ca8msm]

Browsers render CSS in a certain order (i.e. an external style sheet declaration will be overriden by an inline declaration, which in turn will be overriden by a style declaration on the actual element). For more info, see:

http://www.w3.org/TR/REC-CSS2/cascade.html

____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[seaport]

ca8msm,

Thanks for the information.

What happened to my page is that formatting defined by HTML is overridden by CSS.

Here is HTML rendered by aspx.net.

<th align="center" valign="middle" scope="col">Topic</th>

Here is the style defined in the page.

TH
{
 text-align:left 
}

I am not sure I am using the right language. Anyway, in addition to your statement, I think the order should be:
1. HTML code formatting will be overridden by an external style sheet;
2. an external style sheet declaration will be overriden by an inline declaration, which in turn will be overriden by a style declaration on the actual element.

Am I right?

Seaport

 

[ca8msm]

Well, in the case of the HTML you pasted, I think the CSS shloud overrule the align tag and make it align to the left (although it may not work at all as the TH in your CSS is in uppercase when it should be lowercase to match the HTML element).

Also, the idea of using the left align in your CSS is so that you don't use outdated methods such as setting the align attribute (which is most likely not part of the (X)HTML doctype and will fail validation anyway).

That pretty much covers #1 you raised and you are correct with #2.


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[seaport]

ca8msm,

Thanks.

By the way, my code somehow did work in IE6, but I have changed TH to lower case in my CSS.

Seaport

 

[ca8msm]

Yeah, IE6 isn't standards compliant so it does some pretty strange things (luckily for you, this one worked in your favour - most of them don't!).


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.