PrimeFaces 3.2.2中p:fieldset图例默认居中，如何改为左对齐？

问题根源 #

PrimeFaces 3.2.2 版本的p:fieldset组件内置CSS默认将图例设置为居中，官方文档的"默认左对齐"描述对应后续更新版本，属于版本特性差异，并非标签顺序或代码写法问题。

有效修复方案 #

直接通过组件style属性无法修改图例对齐（该属性仅作用于fieldset外层容器，而非内部<legend>标签），需通过CSS选择器针对图例标签设置样式：

1. 局部生效（仅目标fieldset）

给目标p:fieldset添加自定义样式类，再编写对应CSS：

<!-- 修改后的组件代码 -->
<p:fieldset legend="Simple Fieldset" styleClass="left-legend">
  <h:panelGrid>
    <h:outputText value="The story begins as Don Vito Corleone ..." />
  </h:panelGrid>
</p:fieldset>

/* 页面或全局样式文件中添加 */
.left-legend legend {
    text-align: left !important;
    float: left !important;
    margin-left: 8px; /* 可选：调整图例与边框的间距 */
}

2. 全局生效（所有fieldset）

如果需要所有p:fieldset图例左对齐，直接覆盖PrimeFaces内置类：

.ui-fieldset legend {
    text-align: left !important;
    float: left !important;
}

3. 嵌套在dialog中的特殊处理

若上述样式仍被dialog继承样式覆盖，提升选择器优先级：

.ui-dialog .left-legend legend {
    text-align: left !important;
    float: left !important;
}

验证方式 #

修改后刷新页面，检查浏览器开发者工具中<legend>标签的text-align和float属性是否已生效，若仍被覆盖，可继续增加选择器层级或保留!important强制生效。

内容的提问来源于stack exchange，提问作者SeOs_7