H：selectOneRadio HTML输出JSF 1.1 VS 2.0

对于像吹一个selectOneRadio代码：H：selectOneRadio HTML输出JSF 1.1 VS 2.0

<h:selectOneRadio value="#{myBean.selectedItem}" enabledClass="selectOneRadio" disabledClass="selectOneRadio"> 
    <f:selectItem itemLabel="#{myBean.item.label}" itemValue="#{myBean.item.code}"/> 
</h:selectOneRadio>

JSF 1.1似乎会产生HTML输出象下面这样：

... 
<td><label><input type="radio" ...>text text text text ...... </label></td> 
...

但在JSF 2.0 ，它似乎正在生成如下的HTML输出：

... 
<td><input type="radio" ...><label>text text text text ...... </label></td> 
...

在JSF 1.1中，我使用如下所示的css样式来对齐超过一行的长标签文本。但是这个CSS风格似乎并没有工作JSF 2.0的HTML输出。

.selectOneRadio 
{ display:block; 
    text-indent: -25px; 
    margin-left: 22px; 
}

有什么我可以做，使JSF 2.0产生像JSF 1.1的输出还是有一个CSS将用于JSF 2.0输出工作？

来源

2014-01-13 HockChai Lim

我创建了一个的jsfiddle，看看是否有人能帮助我的CSS解决方案：http://jsfiddle.net/8j7dK/。基本上我需要标签与单选按钮位于同一行。如果我删除了display：inline-block，则标签的第2行不与第一行文本对齐。 –

得到它做这个工作：

.selectOneRadio input { 
    vertical-align: top; 
} 

.selectOneRadioLabel { 
    width: 120px; /* width has to set at the label. It won't work if set at table label */ 
    text-align:left; 
    margin-left:4px; 
    display: inline-block; 
} 
<h:selectOneRadio value="#{myBean.selectedItem}" style="selectOneRadio" enabledClass="selectOneRadioLabel" disabledClass="selectOneRadioLabel"> 
    <f:selectItem itemLabel="#{myBean.item.label}" itemValue="#{myBean.item.code}"/> 
</h:selectOneRadio>

来源

2014-01-14 16:50:53

H：selectOneRadio HTML输出JSF 1.1 VS 2.0

回答

相关问题