L'aggiunta di spazio tra i due pulsanti di opzione di h: selectOneRadio

Question

In JSF 2.0 Ho seguito

<h:selectOneRadio value="#{StageGate.sketchesSG002006Decision}" onclick="validateMyRadioButton()" id="radio26"> 
    <f:selectItem itemValue="Accepted" itemLabel="Accepted" id="accepted"/> 
    <f:selectItem itemValue="Rejected" itemLabel="Rejected" id="rejected"/> 
</h:selectOneRadio> 

ottengo uscita come

O Accepted O Rejected 
      ^^ 

Quello che voglio è aggiungere spazio tra due pulsante di scelta in modo che l'uscita sarebbe

O Accepted   O Rejected 
      ^^^^^^^^^^^ 

ho provato ad aggiungere   tra due pulsante tuttavia non funziona. Riceverò il pulsante di opzione sulla riga successiva.

<h:selectOneRadio value="#{StageGate.sketchesSG002006Decision}" onclick="validateMyRadioButton()" id="radio26"> 
    <f:selectItem itemValue="Accepted" itemLabel="Accepted" id="accepted"/> 
    &nbsp;&nbsp;&nbsp; 
    <f:selectItem itemValue="Rejected" itemLabel="Rejected" id="rejected"/> 
</h:selectOneRadio> 

Qualche idea su come questo può essere fatto?

HTML generato senza   è

<table id="radio26"> 
<tr> 
<td> 
<input type="radio" checked="checked" name="radio26" id="radio26:0" value="Accepted" onclick="validateMyRadioButton()" /><label for="radio26:0"> Accepted</label></td> 
<td> 
<input type="radio" name="radio26" id="radio26:1" value="Rejected" onclick="validateMyRadioButton()" /><label for="radio26:1"> Rejected</label></td> 
</tr> 
</table> 

Quando aggiungo &nbsp uno spazio viene generato prima di <table id="radio26"> dichiarazione.

Answer 1

Disclaimer, non so nulla di JSF, quindi quanto segue si basa sulla mia esperienza su ASP.NET e sull'aggiunta di spazi in là. Se questo è selvaggiamente corretta, per favore fatemelo sapere, e rimuoverò immediatamente ...

Prova ad aggiungere lo spazio per l'etichetta punto, l'aggiornamento ...

<f:selectItem itemValue="Accepted" itemLabel="Accepted" id="accepted"/> 

Per ...

<f:selectItem itemValue="Accepted" itemLabel="Accepted &nbsp; &nbsp;" id="accepted"/> 

E potrebbe necessità di essere se stessa defluito in ...

<f:selectItem itemValue="Accepted" itemLabel="Accepted &amp;nbsp; &amp;nbsp;" id="accepted"/> 

UPDATE

Come dice l'OP nei commenti, questo estenderà il collegamento.

Sembra che si dovrebbe essere in grado di impostare una classe CSS per l'oggetto padre con qualcosa di simile ...

<h:selectOneRadio styleClass="myRadioCtrl" ... > 

E poi nel vostro stile/CSS hanno qualcosa di simile ...

.myRadioCtrl span { padding-right: 10px; } 

Answer 2

solo pensato id condividono la mia risposta ... dopo inspecing la pagina con firebug ho finito con il seguente

JSF:

<h:panelGroup id="search-options" layout="block" styleClass="radioButtonSpace"> 
     <h:selectOneRadio value="#{searchEngineController.reportSearch}"> 
     <f:selectItem itemValue="#{false}" itemLabel="CEPIS Search" /> 
     <f:selectItem itemValue="#{true}" itemLabel="Report Search" /> 
     </h:selectOneRadio> 
    </h:panelGroup> 

CSS:

.radioButtonSpace table tbody td {padding-right:50px;} 

Answer 3

Niente di queste risposte ha lavorato per me, ma in questo modo funziona perfettamente:

etichetta .ui-selectoneradio {padding-right: 10px!importante; }

Questo è in caso utilizzando primefaces

Answer 4

stavo avendo problemi con questo. Applicare lo stile non ha funzionato per me quando l'ho fatto su h: selectOneRadio, tuttavia ha funzionato quando è stato applicato in un gruppo di riquadri che lo avvolge.