How to apply CSS to the internal elements of an ASP.NET CheckBoxList control

asp.net checkbox label webforms checkboxlist
smartcaveman picture smartcaveman · Sep 1, 2011 · Viewed 10.1k times · Source

I need to manipulate the attributes of a label element inside an ASP.NET CheckBoxList control. Each checkbox label needs to have a different class. The best alternative I see is to apply the classes with jQuery after the fact. Does anyone know a better method?

I found this post marginally helpful, however, adding an attribute to the list item only wraps the input element and the label element in a span tag with the denoted attributes.

Answer

Barrie A Sargent picture Barrie A Sargent · Oct 25, 2013

Variation of Billy's second answer, but without server side code:

Assign the class to checkboxlist itself

<asp:CheckBoxList runat="server" id="MyCBL" CssClass="MyClass"></asp:CheckBoxList>

Any CSS you apply to the parent element (in this case the checkboxlist, which renders as a table) can be passed to its child elements:

<style>
    .MyClass label {color: Blue}
    .MyClass input[type='checkbox'] {background-color: Red}
</style>

Related questions

OnClick vs OnClientClick for an asp:CheckBox?

Does anyone know why a client-side javascript handler for asp:CheckBox needs to be an OnClick="" attribute rather than an OnClientClick="" attribute, as for asp:Button? For example, this works: <asp:CheckBox runat="server" OnClick="alert(this.checked);" /> …

Read More
How do I make a checkbox required on an ASP.NET form?

I've done some searching on this, and I've found several partial answers, however nothing that gives me that warm fuzzy "this is the right way to do this". To answer the most frequently occurring complaint against this question: "checkboxes can …

Read More
How to validate a user chose at least one checkbox in a CheckBoxList?

I've got a CheckBoxList control that I want to require the user to check at least ONE box, it does not matter if they check every single one, or 3, or even just one. In the spirit of asp.net's validation …

Read More