如何将此复选框居中

Question

如何水平居中/对齐此复选框和文字？

    <h:panelGroup>
      <div>                  
        <h:selectBooleanCheckbox id="deactivate" title="select to deactivate" />
        <h:outputText value="${msg['deactivate/confirm']}" for="deactivate" />                                     
     </div>                 
    </h:panelGroup>

Answer 1

您只需要像这样申请style="width: 500px;text-align: center;"：

<h:panelGroup layout="block" style="width: 500px;text-align: center;">               
    <h:selectBooleanCheckbox id="deactivate" title="select to deactivate" style="vertical-align: middle;" />
    <h:outputText value="${msg['deactivate/confirm']}" for="deactivate" />      
</h:panelGroup>

当然，您必须有宽度才能看到差异。我不需要div，所以我将其删除了。