我怎样才能使这个复选框居中答案

【问题标题】：How can I center this checkbox我怎样才能使这个复选框居中
【发布时间】：2013-06-18 09:09:41
【问题描述】：

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

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

【问题讨论】：

以后，我建议不要使用[html] 标签来处理看似纯JSF 的问题。您根本没有发布任何 HTML 代码。如果您需要[html] 用户的帮助，您不应该发布原始 JSF 源代码，而是发布其生成的 HTML 输出，您可以通过右键单击查看源代码在浏览器中看到。只有这样[html] 用户才能理解您的问题并能够在[html] 上下文中回答它。然后，只需以生成与答案中所述完全相同的 HTML（和 CSS）的方式编写 JSF 代码即可。我认为反对票来自[html] nitpicker。
@BalusC 感谢您的推荐

标签： html jsf

【解决方案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，因此我将其删除。

【讨论】：

tnx +1 这有帮助，但复选框仍然比文本高一点，有什么想法吗？我删除了“块”，顺便说一句，它使页面中间的所有内容都居中，我希望它左对齐
tnx 实际上仍然不是很对齐 :)
@Spring 的对齐方式取决于您的 CSS arround，您可以使用 vertical-align 或 line-height 在没有完整图片的情况下做很多事情:)