h:selectOneRadio in rich:tabPanel visual problem

[ainanmis]

radio buttons is shifted. How can I solve this problem. Can you help me? My code is below

<rich:tabPanel switchType="client">

                                    <rich:tab header="Hasta Bilgi Formu">

                                        <h:panelGrid columns="3">

                                                 <h:outputText value="Kabul Tipi" styleClass="blueLabel" />

                                                 <h:selectOneRadio id="kabulTipi" value="#{mybean.kabul} "

                                                  layout="pageDirection">

                                                           <f:selectItem itemValue="POL" itemLabel="Pol"/>

                                                           <f:selectItem itemValue="DAH" itemLabel="Dah"/>

                                                          <f:selectItem itemValue="CER" itemLabel="Cer"/>

                                                 </h:selectOneRadio>

                                                 <h:message for="kabulTipi" style="color:red"/>

                                         </h:panelGrid>

                                    </rich:tab>

</rich:tabPanel>

[iabughosh]

Dear Abdulkerim,

I've tried your code i didn't see any shifting :

i tried both pageDirection and lineDirection layout, which shifting do you refer ?

[ainanmis]

Dear İbrahim, I assume that the problem  is because of  itemLabel value length. please try below selectItem.

                              <f:selectItem itemValue="POL" itemLabel="Poliklinik"/>

                            <f:selectItem itemValue="DAH" itemLabel="Dahili Yatış"/>

                            <f:selectItem itemValue="CER" itemLabel="Cerrahi Yatış"/>

When I didn't put h:selectOneRadio in rich:tabPanel, it is displaying correctly.

[ilya_shaikovsky]

Abdulkerim İnanmış, please issustrate that with screenshot also

[ainanmis]

The screen image is above. I assume that h:panelGrid column is not enough for long itemLabel values.  I changed column width with style and it is displaying correctly now.

[iabughosh]

Dear Abdulkerim,

I've tried your labels and everything is ok :

i suspect your style class blueLabel, plz remove it & check.

[ainanmis]

I removed style class, but it is still same. When I increased column width, it displayed correctly.

[iabughosh]

which column width, are you using dataTable ??!!

[ainanmis]

I am not using dataTable.  I am using panelGrid. I used styleClass for panelGrid columns.

<h:panelGrid columns="3"  columnClasses="col100,col150,col100">

.col100{

    width: 75px;

}

.col150 {

    width: 125px;

    text-align: left;

}

[iabughosh]

what happens if you remove the columnClasses attribute ?

[ainanmis]

Anything did not changed.

[iabughosh]

please attach your xhtml & css files.