7 Replies Latest reply on May 9, 2011 10:22 AM by snaker

    Chekbox around h:selectOneRadio in IE

    narvava

      Hi All,

       

      In my richfaces application, wherever I use h:selectOneRadio, checkbox shape is getting wrapped around radio button in IE. It is working fine with FF.

      Could you please check attached image and suggest what could be the possible reason causing the problem ?.

      Regards,

      Naresh.

        • 1. Chekbox around h:selectOneRadio in IE
          snaker

          Is the radio in a table???

           

          if it is true, is because if you look the source code radio is a table, you must create a style class for this radio;

          for example:

               .radioClass{

                    border:0px;

                    background-color:none;

               }

          • 2. Chekbox around h:selectOneRadio in IE
            narvava

            Hi Kike,

             

            Thank you for the reply. Yes, the radio is in table. I tried to apply the css for radio buttons but its not working. In fact the problem is there for check boxes also. But after applying border:0px, problem got solved but the same is not working in radio button case.

            Please check radio button code as follows,

             

              <h:panelGrid columns="2">

                     <h:selectOneRadio value="#{sdlRegDetails.coverageMonth}"

                      valueChangeListener="#{scheduleHelper.reSetCovMonthValues}"

                      styleClass="oncallFonts;radioClass;note;" id="currMonId"

                      disabled="#{!sdlRegDetails.coverageMonthEnable}">

                      <f:selectItem id="currentmonth" style="font-weight:bold"

                       itemValue="#{dateUtil.currentMonth}">

                      </f:selectItem>

                     </h:selectOneRadio>

                     </h:panelGrid>

             

            Regards,

            Naresh

            • 3. Chekbox around h:selectOneRadio in IE
              snaker

              sorry i forgot this:

               

              .radioClass td{

                        border:0px;

                        background-color:none;

                 }

               

              you try with this way

              • 4. Chekbox around h:selectOneRadio in IE
                narvava

                Hi Gil,

                 

                I tried this as well without success. Is there any other way?

                 

                Regards,

                Naresh.

                • 5. Chekbox around h:selectOneRadio in IE
                  snaker

                  if there is another way  i dont know but the problem is by css class.

                   

                  I have seen that:

                   

                  styleClass="oncallFonts;radioClass;note;" in yor h:selectOneRadio, if you put that way doesn't work. if you want apply style to the columns of panelGrid you must put the class css of this way: h:panelGrid styleClass="oncallFonts,note"

                   

                  if only you want apply style to select you must put this:

                   

                  .radioClass td{

                            border:0px;

                            background-color:none;

                     }

                  h:selectOneRadio styleClass="radioClass" (only one style class) if you put more classes doesnt work.

                   

                  It must works with the last line

                  • 6. Chekbox around h:selectOneRadio in IE
                    ilya_shaikovsky

                    I think it caused by standard skinnig mechanism. You could check styles applied using Firebug. And you could solve it by : a) overriding the CSS properties using html elements selectors. b) using !important mark in your custom CSS classes. c) turning standard skinning off - then your custom classes will works(but there wil be no skinning for inputs and so on)

                    • 7. Chekbox around h:selectOneRadio in IE
                      snaker

                      hi ilya, i happened the same, and the problem was that the radio was in dataTable or table and this has style class, so, the radio get the same style of the table, i solved applying another style in h:selectOneRadio.

                      I don't know if there is another way to do but this way works fine