Я не могу использовать свой собственный значок для простого лица p: commandButton. Мой код:

    <p:commandButton value="Cancel" action="#{userBb.cancel()}" 
       icon="ui-icon-myCancel" /> 

CSS это:

.ui-icon-myCancel{
   background-image: url(images/cancel_16.png) !important;
}

Структура папок обычная:/resources/images/cancel_16.png

В результате я получаю:

Когда я пытаюсь:

.ui-state-default .ui-icon .ui-icon-myCancel{
   background-image: url(images/cancel_16.png) !important;
}

Я получил:

Когда я смотрю на отчет о Firebug, там есть раздел span

<span class="ui-button-icon-left ui-icon ui-c ui-icon-myCancel"></span>

есть:

.ui-state-default .ui-icon {
    background-image: url("/WarPort08_02b/javax.faces.resource/images/ui-icons_38667f_256x240.png.xhtml?ln=primefaces-aristo");

Я смотрел на этообъяснениеи другие, но не нашли ответа.

Когда я пытаюсь p: commandLink с h: graphicImage значок виден, но это изображение в виде кнопки / ссылки.