9 Replies Latest reply: Mar 21, 2013 10:01 AM by Howard (... in Training) RSS

    Checkbox_columns_between_distance

    Khadija Khalfallah
      Hi everyone,

      I'm creating an APEX application and I have inserted a checkbox with 2 columns. The problem is that I find the displayed distance between the two columns very close. Is there a way to expand it ? perhaps some attribute in the checkbox item defintion to change or something like that ?

      Thanks for help!

      Best regards,

      Edited by: Khadija Khalfallah on 20 mars 2013 17:56
        • 1. Re: Checkbox_columns_between_distance
          Howard (... in Training)
          I don't see any declaritive attribute selection which applies to spacing. Maybe there is HTML that can solve this.

          If I want to add spaces to things, I usually just add & nbsp; to the label, Pre-text or Post-text.

          So I tried a few things -- but they failed.

          Edited by: Howard (... in Training) on Mar 21, 2013 7:15 AM Meant NOT in the sentence below.
          1) In this case & nbsp; doesNOT work as the ";" would be parsed as an LOV separator as in:
          STATIC2:Coffee;Coffee,Tea;Tea,N/A;N/A
          So that won't work, I guess.

          2) Then I tried adding & nbsp; to a list of values Shared Component. But it did not recognize that because I got "& nbsp;Coffee& nbsp;" displayed for the description/name. 3) So I tried including spaces in the LOV description/name like "  Coffee  " but those spaces were parsed out. You just can't win!

          What is your source for the checkbox descriptions/names you are using?

          Maybe it can be done with some CSS.

          Howard
          • 2. Re: Checkbox_columns_between_distance
            fac586
            Khadija Khalfallah wrote:
            Hi everyone,

            I'm creating an APEX application and I have inserted a checkbox with 2 columns. The problem is that I find the displayed distance between the two columns very close. Is there a way to expand it ? perhaps some attribute in the checkbox item defintion to change or something like that ?

            Thanks for help!
            When you have a problem you'll faster, more effective help by including as much relevant information as possible upfront. This should include:

            <li>Full APEX version
            <li>Full DB/version/edition/host OS
            <li>Web server architecture (EPG, OHS or APEX listener/host OS)
            <li>Browser(s) and version(s) used
            <li>Theme
            <li>Template(s)
            <li>Region/item type(s) (making particular distinction as to whether a "report" is a standard report, an interactive report, or in fact an "updateable report" (i.e. a tabular form)

            With APEX we're also fortunate to have a great resource in apex.oracle.com where we can reproduce and share problems. Reproducing things there is the best way to troubleshoot most issues, especially those relating to layout and visual formatting. If you expect a detailed answer then it's appropriate for you to take on a significant part of the effort by getting as far as possible with an example of the problem on apex.oracle.com before asking for assistance with specific issues, which we can then see at first hand.

            The basic answer is to use CSS margins or padding:
            input[type="checkbox"] { margin: 5px; }
            The specifics of how to do this in your APEX app are dependent on the above information.
            • 3. Re: Checkbox_columns_between_distance
              Howard (... in Training)
              Where would one do this on apex.oracle.com (Application Express 4.2.1.00.08)? I have an example there I'm working on.
              • 4. Re: Checkbox_columns_between_distance
                fac586
                Howard (... in Training) wrote:
                Where would one do this on apex.oracle.com (Application Express 4.2.1.00.08)? I have an example there I'm working on.
                For simple examples use the Inline CSS page property.
                • 5. Re: Checkbox_columns_between_distance
                  Howard (... in Training)
                  Thanks.

                  Beware of what you ask for! Forgive me. I've fallen into the XY problem. http://meta.stackoverflow.com/questions/66377/what-is-the-xy-problem

                  Yes, this technique affects the spacing but "margin" seems to control spacing before the checkbox, before the LOV-display-name, after the LOV-display-name, ...

                  So what I get is equal spacing -- before-box-space box before-LOV-display-name-space LOV-display-name after-LOV-display-name-space box ....

                  The real "problem":
                  When checkboxes are horizontal, it seems some users might check a box to the right of a selection instead of to the left. This results from the LOV-display-names being equally spaced between two checkboxes.

                  The "solution":
                  The solution I had in mind -- and thought I would stumble into -- was to add (more) space following each LOV-display-name. Thus it would seem to visually group each checkbox display-name pair together. The "margin" value doesn't give this solution.

                  Oh, well, sorry,
                  Howard
                  • 6. Re: Checkbox_columns_between_distance
                    fac586
                    Howard (... in Training) wrote:
                    Thanks.

                    Beware of what you ask for! Forgive me. I've fallen into the XY problem. http://meta.stackoverflow.com/questions/66377/what-is-the-xy-problem

                    Yes, this technique affects the spacing but "margin" seems to control spacing before the checkbox, before the LOV-display-name, after the LOV-display-name, ...

                    So what I get is equal spacing -- before-box-space box before-LOV-display-name-space LOV-display-name after-LOV-display-name-space box ....

                    The real "problem":
                    When checkboxes are horizontal, it seems some users might check a box to the right of a selection instead of to the left. This results from the LOV-display-names being equally spaced between two checkboxes.

                    The "solution":
                    The solution I had in mind -- and thought I would stumble into -- was to add (more) space following each LOV-display-name. Thus it would seem to visually group each checkbox display-name pair together. The "margin" value doesn't give this solution.
                    Example on apex.oracle.com?
                    • 7. Re: Checkbox_columns_between_distance
                      Howard (... in Training)
                      Yes. If you just want to look, it's on page 4. http://apex.oracle.com/pls/apex/f?p=25096:4: Login: Dever / Ima9Dever
                      • 8. Re: Checkbox_columns_between_distance
                        fac586
                        Howard (... in Training) wrote:
                        Thanks.

                        Beware of what you ask for! Forgive me. I've fallen into the XY problem. http://meta.stackoverflow.com/questions/66377/what-is-the-xy-problem

                        Yes, this technique affects the spacing but "margin" seems to control spacing before the checkbox, before the LOV-display-name, after the LOV-display-name, ...

                        So what I get is equal spacing -- before-box-space box before-LOV-display-name-space LOV-display-name after-LOV-display-name-space box ....

                        The real "problem":
                        When checkboxes are horizontal, it seems some users might check a box to the right of a selection instead of to the left. This results from the LOV-display-names being equally spaced between two checkboxes.

                        The "solution":
                        The solution I had in mind -- and thought I would stumble into -- was to add (more) space following each LOV-display-name. Thus it would seem to visually group each checkbox display-name pair together. The "margin" value doesn't give this solution.
                        So you really want to control the spacing of checkbox labels rather than checkboxes themselves?
                        .checkbox_group input[type="checkbox"] {
                          vertical-align: middle; /* optional, but it makes it look better (at least on IE8) */
                        }
                        .checkbox_group label {
                          margin: 0px 10px 0px 2px;
                        }
                        <tt>checkbox_group</tt> is the class for the HTML table container APEX uses to lay out the checkboxes.
                        • 9. Re: Checkbox_columns_between_distance
                          Howard (... in Training)
                          THANKS!

                          That works for me. For others, YMMV - Your milage may vary.

                          [When I think of <i>label</i>, I'm refering to the Item label itself, for example, "Beverage".  Sorry, if I had said "<i>value label</i>" at the start -- Coffee, Tea, etc., maybe it would have been clearer.]

                          Kind regards,
                          Howard