Невозможно изменить Primefaces p: свойства шрифта commandButton

Question

Мне нужны некоторые настраиваемые кнопки на моем сайте, которые выглядят иначе, чем другие. Я создал класс css для этих кнопок, но он ведет себя странно.

это класс:

.regCommandButton { 
    color: #ffffff; 
    background: #29b6a0; 
    border-color: #23a38f; 

    width: 100%; 
    height: 25px; 

    font-family: 'pluto_sansthin'; 
    font-size:1.4em;  
} 

импорта шрифтов в том же CSS файл:

@font-face { 
font-family: 'pluto_sansthin'; 
src: url(#{resource['fonts/plutosansthin-webfont.eot']}); 
src: url(#{resource['fonts/plutosansthin-webfont.eot?#iefix']}) format('embedded-opentype'), 
    url(#{resource['fonts/plutosansthin-webfont.woff']}) format('woff'), 
    url(#{resource['fonts/plutosansthin-webfont.ttf']}) format('truetype'); 
font-weight: normal; 
font-style: normal; 

}

реализация HTML:

<p:outputPanel> 
    <p:commandButton styleClass="regCommandButton" value="Save" action="#{URBean.saveNewUser}" update="regPanel" /> 
</p:outputPanel> 

Моя проблема заключается в том, что шрифт, связанный с пр. Операции (font-family, font-size) не устанавливаются, если кнопка находится внутри p:outputpanel. Все остальные действуют на кнопку.

Если я положил кнопку за пределы выходной панели, все будет как ожидается.

EDIT: Использование! Важно для свойств шрифта, не помогает.

Answer 1

Вы можете решить эту замену .regCommandButton с помощью .ui-button.regCommandButton.

Делая что ты говоришь Täht каждый элемент с .ui-button И .regCommandButton будет иметь описанные приличий:

.ui-button.regCommandButton { 
    color: #ffffff; 
    background: #29b6a0; 
    border-color: #23a38f; 

    width: 100%; 
    height: 25px; 

    font-family: 'pluto_sansthin'; 
    font-size:1.4em;  
}