I am attempting to modify the background-image of a h:commandButton element located within a RichFaces:panel.
To achieve this, I created a CSS file with the following styling rule:
.sButton
{
background-image:url('../imgs/btnTexture2.jpg');
background-repeat:repeat-x;
color: white;
}
In the XHTML file, I implemented the following:
<h:commandButton id="btnTest" styleClass="sButton" ...../>
Although this styling worked with JSF, it does not have the desired effect with RichFaces.
Upon inspecting in Chrome, I identified a conflicting rule within the skinning.ecss:31 file.
How can I avoid this conflicting rule and ensure my custom styling is applied?
While adding the style attribute directly in the commandButton element produces the desired result, I prefer not to clutter the XHTML file with styling information.
Is there a way to enforce the application of my styling rule and modify the background of the h:commandButton in RichFaces?