在jsf中的selectOneRadio中添加单选按钮和Label之间的空格

时间:2014-02-18 12:21:39

标签: css jsf selectoneradio

可以在单选按钮和其标签之间添加空格。

我们在f中有任何属性:selectItem用于执行此操作

我必须将无线电对齐到页面的其他组件。我的标签是对齐的,但为了对齐收音机,我需要在它和标签之间留出一些空间。

我无法找到任何属性来帮助我。

请帮忙。

2 个答案:

答案 0 :(得分:1)

以下是我最近使用primefaces的方式:

<p:column headerText="Is your hair naturally blonde?" width="140">
        <p:selectOneRadio value="#{mybean.haircolor}" id="haircolor" layout="custom">
            <f:selectItem itemValue="true" />
            <f:selectItem itemValue="false" />
        </p:selectOneRadio>

        <p:panelGrid columns="2">
            <h:panelGroup>
            <p:radioButton id="hairColorYes" for="haircolor" itemIndex="0"/>
             <h:outputLabel for="hairColorYes" value="Yes" styleClass="radiolabelPF"/>
            </h:panelGroup>
            <h:panelGroup>
            <p:radioButton id="hairColorNo" for="haircolor" itemIndex="1"/>
            <h:outputLabel for="hairColorNo" value="No" styleClass="radiolabelPF"/>
            </h:panelGroup>  
         </p:panelGrid>
 </p:column>

然后我的一个CSS样式:

.radiolabelPF {
  margin-left: 5px;  
}

诀窍是在<p:selectOneRadio>中使用layout =“custom”。我的实际单选按钮和标签位于<h:panelGroup>标签内。

这是我可以控制Primefaces中无线电标签和按钮之间空间的唯一方法。它也记录在selectOneRadio文档的“自定义布局”部分中。

http://www.primefaces.org/showcase/ui/input/oneRadio.xhtml

答案 1 :(得分:-1)

请使用CSS样式执行此任务 - 有关示例,请参阅this tutorial