Previously I wrote about how the ASP.NET Label control <asp:label runat="server" /> renders as a <span> and how that makes CSS development difficult. I am still trying to make all my new development be completely based upon CSS and I continue to struggle with some seemingly rather simple things.

Take the ubiquitous checkbox as an example:

<asp:checkbox  name="cbborder" runat="server" title="My new checkbox" cssClass="checkborder" />

If you had a css that looked like

.checkborder {  border: solid 2px blue;  width: 120px;}

You would expect  that this would render the checkbox with a border that was 120px wide. ASP.NET will render this as:

<span>

<input name="checkborder" id="checkborder" type="checkbox"></input><label for="checkborder">My new checkbox</label>

</span>

 So the problem is that our CSS won't style the label since it doesn't have the ID or cssClass we assigned to the checkbox. The solution I've fallen back to is to make the checkbox title=""

and then add an html label to the page with the appropriate ID.

It sucks, but it works.