How to skin the font of the ADF commandButton

Environment

This case has been tested in the following environment

• JDeveloper 11.1.1.6

UseCase

After testing some time and getting very frustrated I finally found out how to skin the font of the ADF commandButton

Solution

This is what my skinning did look like at first

af|commandButton {
    color: #000000;
    font: 12px bold Arial,Helvetica,Geneva,sans-serif;    
}

The problem was, that when I did hover or click the button the font always changed to 

10pt Arial normal

So I did change my code to this

af|commandButton,  
af|commandButton:hover,  
af|commandButton:active,  
af|commandButton:focus:hover {
    color: #000000;
    font: 12px bold Arial,Helvetica,Geneva,sans-serif;    
}

This also didn't work. I was trying and testing many different things and was looking in Firebug and just couldn't understand why it didn't take my definition.

What I had to do was adding text-only at the end of each class and it was working like a charme. So here is the code I used to adjust the font of my commandButton.

af|commandButton:text-only,  
af|commandButton:hover:text-only,
af|commandButton:active:text-only,
af|commandButton:focus:hover::text-only {
    color: #000000;
    font: 12px bold Arial,Helvetica,Geneva,sans-serif;    
}

Contact me if you still have problems with this