Change css of ext:button

[bsnezw]

I am trying to change the look of the text in a button. I have created a class

    .textbutton  { font:bold 7.5pt Century Gothic, Arial, sans-serif; }


   <ext:Button ID="btnReset" runat="server" Text="Reset" Cls="textbutton" />

and assigned it to Cls="textbutton". I have also tried adding it to the StyleSpec="font:bold 7.5pt Century Gothic, Arial, sans-serif;"

For the label to work I had to add span to the end of the css definition

    .text span    {        font:bold 7.5pt Century Gothic, Arial, sans-serif;  }

there isn't a span around the button but I tried it anyway - no luck.

I have also tried to override the class x-btn-text within the markup on the page that the button is on

<script type=text/css>
    .x-btn-text .x-btn-center, .x-panel-btn-td 
    {
        font:bold 7.5pt Century Gothic, Arial, sans-serif;
    } 
</script>

didn't work. What step am I missing?

Thanks~

[bsnezw]

I'm also having the same issue with radio buttons. I've tried changing the x-form-cb-label to no avail.

Thanks~

[bsnezw]

In case anyone else runs into this issue:

to override the ext class for the button:

    .x-btn button{
        font:bold 7.5pt Century Gothic, Arial, sans-serif;
    }

for the radio labels:

    .x-form-cb-label {
        font:bold 7.5pt Century Gothic, Arial, sans-serif !important;
    }

the !important is required.