Why doesn't table > tr > td work when using the child selector?

Solution 1:

In HTML, browsers implicitly add a tbody element within which to contain the tr elements¹, so in reality, tr is never a child of table.

Consequently, you have to do this instead:

table > tbody > tr > td

Of course, if you add a tbody element yourself, you use the same selector. The spec explains when a tbody is added implicitly otherwise:

Tag omission

A tbody element's start tag may be omitted if the first thing inside the tbody element is a tr element, and if the element is not immediately preceded by a tbody thead, or tfoot element whose end tag has been omitted.

¹_{This is not the case for XHTML documents that are properly served as application/xhtml+xml, however, given its XML roots.}

Solution 2:

If you want to be more catholic than the pope :) here is what I did (because none of the above worked for me):

1) Create a css class, assign it to the property of the GridView (eg:

<PagerStyle CssClass="pagerNoBorder" /> 

)

2) Define you css class just as the page numbers are rendered by your browser (inspect the element in the browser and look for all the child selectors!). In my case, this was the situation:

.pagerNoBorder > td > table > tbody > tr > td
    {
        border-width:0px !important;
        border-style:none;
    }

If you're going to say why border-width (+ !important) and border-style in the same time then read again the intro of my answer :) . Cheers and good day!