Dave asks...
... why, when I add a CssClass to an asp:CheckBox, does it wrap the checkbox within a span? Maybe there's some esoteric reason for this, but when pondering why my CSS isn't being applied I have to View Source to find out what the heck is going on...
[Via writerus drivelus]
Of course, he's right. There's something not quite right about the CssClass property on ASP.NET server controls. The whole point of server controls is to shield you from having to concern yourself with exactly what HTML they will produce (if, indeed, they produce HTML at all - there's nothing to stop them producing WML, CHTML, XML, JavaScript, or whatever else they happen to choose...). From a server-programming perspective, you aren't bothered about whether <asp:checkbox> renders <input type="check">, <span><input type="check">, or some dynamic javascript that provides the same user experience via a three-d rotating checkbox graphic. But when it comes to applying CSS classes, you need to know which element the class attribute's going to show up on so you can reference it in your stylesheet.
Indeed, one particularly common ASP.NET 1.1 server control - <asp:Panel> - renders out <div> elements for uplevel browsers, and <table><tr><td> elements for downlevel clients. Since the default browser capabilities analysis performed by ASP.NET ranks browsers like, to pick a few at random, Opera, Mozilla, Firefox and Safari as downlevel browsers, this pretty much means it renders <div>s only for IE.
The upshot of this? Well, if you set the CssClass of a panel - let's say I decide to write: <asp:Panel runat="server" id="myFunkyPanel" cssclass="funky"> - then you're going to want to include some CSS style information to style this panel in your CSS file. But you can't just write div.funky { background-color: blue; } (even though blue is very funky). You also need table.funky { background-color: blue; }. Or, you can use .funky { background-color: blue; }, and not worry about what kind of element will be rendered. But woe betide you if you have something along the lines of td { background-color: orange; } anywhere in your CSS...
The thing is, because you're using a server control, you shouldn't be concerned with what HTML it renders. But because you're using CSS, you need to be very concerned about what HTML it renders. I'm not sure how ASP.NET ought to resolve that dichotomy, but I wonder whether ASP.NET 2.0 themes help - or just make things worse.