.Net Radiobutton class

im trying to style my radiobutton.

But something strange happens when i compile and checke the code with firbug.

MyCod开发者_高级运维e:

<asp:RadioButton ID="selType1" GroupName="Type" runat="server" CssClass="radioB" Checked="true" />

Firebug:

<span class="radioB">
   <input id="ctl00_ctl00_BodyContentHolder_TestController_1_selType1" name="ctl00$ctl00$BodyContentHolder$TestController_1$Type" value="selType1"` checked="checked" type="radio">

For some reason, the SPAN tag gets the class name, not the INPUT tag.

Anyone know why this is?

Thx Marthin

I have one theory on why it wants to create a span with the class over the input element. If there is more than one input with the same class name next to each other then it might as well create a span to cover them both, instead of specifying class="radioB" for both of them. ASP.NET components are known to spit out some ugly HTML.

Here's one solution to make the radioB class work on the input element, modify the CSS for the radioB class in the following way:

.radioB input
{
    ...
}

But there may be another solution for you, try out the following code:

selType1.InputAttributes["class"] = "radioB";

I had the very same problem, It's the text string that you assigned to radio button that get the style.

For solving this problem I wrote a JQuery script that gets the parent span class on load of the form.

Checkbox also has the same problem. Here is my script:

$("input[type=checkbox]").each(function() {
                $(this).attr("class", $(this).parent().attr("class"));
                $(this).parent().attr("class", "");
            });

Maybe you want to customize it e.g. just adding the class to the RadioButton not removing it from parent span