The Paragraph field: Have list numbers in parentheses.

  • Profile Image
    ottawajoshkorn
    Asked on October 15, 2021 at 05:28 PM

    What I have at the moment is a list with items numbered:

    A. ....

    B. ......

    C. ....

    D. ....

    Is there a way I can change the customization so that the items appear like this?

    (a) ....

    (b) ......

    (c) ....

    (d) ....


    TIA

    Josh

  • Profile Image
    Anthony_Evans
    Answered on October 15, 2021 at 07:25 PM

    Howdy Josh,

    Please inject this CSS:

    .form-html ol {
      counter-reset: list;
    }
    .form-html ol > li {
      list-style: none;
    }
    .form-html ol > li:before {
      content: " (" counter(list, lower-alpha) ") ";
      counter-increment: list;
    }

    Thank you for your patience and understanding!

  • Profile Image
    ottawajoshkorn
    Answered on October 15, 2021 at 08:46 PM

    It doesn't work. The indents get lost.

    I get

    (a) asdfasd flk fas;lkfs lsk s;lfk s;dlfjkasd;lfjksad ;fl sd;lksdf;lsadkf;lsadkfas;ldfk s;dlfk sd;lfks;lfksf;lksdf;lsakdf;aslfksad;lfksd;flksdf;lasdkf;lsdfk

    (b) kljadfsjlkfsdljkfsd sd sd f ;lsd flksfj sklf slkfj slksj dlskjf slkfj slkj flksjflksj sdlkjf aslkfj lkf jslkfj slkdj slkfj lskdjf slkdfjslkdjfslkdfjslkfj

    etc.

    At least I had those before.

  • Profile Image
    Lorenz_A
    Answered on October 15, 2021 at 09:59 PM

    Hi there,

    I checked your form, and I assume you are referring to the paragraph element, and it seems like you've already applied what you're trying to accomplish.

    1634349506_616a31c2c6328_The Easiest Onl

    Should you need any further assistance, please let us know.

  • Profile Image
    ottawajoshkorn
    Answered on October 15, 2021 at 11:21 PM

    Surely you can see that it’s improper paragraph alignment.

    The bullet is supposed to be outdented.

    Take out the custom CSS and see what the paragraphs should look like.

    1634354510_616a454ed1a02_

  • Profile Image
    Kenneth_C
    Answered on October 16, 2021 at 02:39 AM

    Hi there,

    Is this how you want it to look?

    1634366226_616a73124d118_h1.png

    If so, then please add this code into your Inject Custom CSS Area, along with the codes my colleague provided earlier: https://www.jotform.com/help/117-how-to-inject-custom-css-codes/

    .form-html ol > li:before {

      padding-right: 10px;

    }

    I hope that helps.

    Best.

  • Profile Image
    ottawajoshkorn
    Answered on October 16, 2021 at 11:19 AM

    No. I want it to look the way most bulleted-point lists look (the dashed line is just for your benefit):

    1634397368_616aecb88acaf_

    Word, for example, correctly formatted this text from a copy-and-paste without batting an eyelid.

  • Profile Image
    Gaetan_B
    Answered on October 16, 2021 at 11:45 AM

    Hello,

    This is possible but you would need to edit the source code of that element to wrap each paragraph with the following:

    <li><p style="padding-left: 33px;">conduct affairs in compliance with applicable laws and adhere to the highest principles of business ethics and transparency;</p><br/><br/></li>

    1634399138_616af3a2e1a5b_


    Best regards

  • Profile Image
    ottawajoshkorn
    Answered on October 16, 2021 at 01:17 PM
    .form-html ol > li {
     list-style-type: lower-alpha;
    }

    This gets pretty close, is a lot simpler, and works. If you can find a way to include the parentheses into the mix, then by all means, go ahead.

  • Profile Image
    Gaetan_B
    Answered on October 16, 2021 at 02:33 PM

    Hello,

    To add the parentheses one of my colleagues already provided you with the code:

    .form-html ol > li:before {
      content" (" counter(list, lower-alpha) ") ";
      counter-increment: list;
    }


    Also please note that what you are asking for is not a web standard (you can find all the list-style-type here: https://www.w3schools.com/css/tryit.asp?filename=trycss_list-style-type_all), so it will very certainly require custom code and certain types of workarounds to make it possible according to web standards.


    Your list is considered as a single block, and we cannot add the parentheses dynamically as it is not a standard.

    So the workaround, as the whole list is considered one big block, is to put some p tags so that we can shift the rest of the text as a separate entity and thus reach the effect you are looking for.


    Best regards

  • Profile Image
    ottawajoshkorn
    Answered on October 17, 2021 at 06:36 PM

    What you're proposing is short-sighted. It would require a programmer to modify it, and that's just not practical. Parentheses around item numbers is something you should be providing, out of the box, just like Microsoft Word.

    Thanks, I'll go for the low-maintenance solution.


  • Profile Image
    Amin_N
    Answered on October 17, 2021 at 06:52 PM

    We sincerely apologize for any inconvenience you may have encountered.

    Kindly be informed that, unfortunately, it's not possible to have list numbers in parentheses in the Paragraph field.

    However, I've successfully escalated this as a feature request to our developers. Also, please note that we can not provide you with when or if this will be implemented. If there is any update, we will inform you via this support ticket.   

    Your understanding is most appreciated.