css - PrimeFaces 功能区中的 FONT_AWESOME 图标未正确显示

Question

我面临这样一种情况，即每个 FONT_AWESOME 图标都显示在 Primefaces 功能区中任何操作按钮内的底部，从而隐藏了应该为每个按钮显示的文本。 我尝试使用大量凌乱的 css 进行覆盖，但没有成功

功能区中我的操作按钮代码

<p:commandButton value="New" icon="fa fa-camera-retro fa-3x" styleClass="ui-ribbon-bigbutton myButton" type="button" />

这里是我的自定义CSS代码

myButton{

    display: block;
}

.fa{
   vertical-align: top; 
}

我希望它像这样格式化

我正在使用 primefaces 5.2 和 glassfish 4.1

Answer 1

编辑如下:

<style type="text/css">           
        .ui-icon.fa{
           margin-top: -22px !important;
        }

    </style>

你可以这样解决