I have chosen "Other" for an answer to a question

  • deckerspence
    Asked on January 16, 2019 at 3:51 PM

    How do I make the space for the "Other" answer wider? It is very narrow compared to the text on the answers I am offering.

    (P.S. I am trying to search for answers and not finding them - if there is a trick please share it.)

  • jonathan
    Replied on January 16, 2019 at 4:48 PM

    You can do it by adding this CSS codes on your form 

    #input_7{

      width: 350px;

    }

    1547675128zzz 2019 01 17 05 Screenshot 10


    Let us know if this did not work for you.

  • deckerspence
    Replied on January 17, 2019 at 6:10 AM

    Yes - this works. I had to first find the form element designer:)  Cool.  Now, perhaps you can make a recommendation. When I make it wide enough to look "right" on a desktop, it appears oddly on a phone. The text entry area spans off the screen and is actually placed below the checkbox that appears to the left of it. What is your recommendation?

  • Ashwin JotForm Support
    Replied on January 17, 2019 at 9:46 AM

    I  have injected following custom css code in your form:

    @media only screen and (max-device-width: 480px) {

    #input_7{

      width:300px !important;

      }

    }

    Please test your form in mobile device and see if the other textbox field is displayed correctly.

    Do get back to us if you need any other changes.

  • deckerspence
    Replied on January 17, 2019 at 9:52 AM

    Very clever. Perfect. Years ago, I knew some basic CSS - hardly could avoid it as I had a teenager who was developing websites. Forgot all of it. Thank you very much.

  • deckerspence
    Replied on January 18, 2019 at 5:33 PM

    Ashwin - I lost the custom CSS. I tried to put it back in the same place but it does not seem to be working. (I think maybe I lost it because I looked at the themes and tried a few out. I'm sorry. Can you please fix? I'd also love to know what I did wrong so I can learn please.  See pic.

    answers Screenshot 10

     

  • jonathan
    Replied on January 18, 2019 at 6:40 PM

    I added back the CSS codes

    #input_7{

      width: 300px;

    }

    1547854805zzz 2019 01 19 07 Screenshot 10

    Please check again and test on your mobile browser.

    Let us know if still not working.

  • deckerspence
    Replied on January 18, 2019 at 8:01 PM

    Thank you. I did change it to 480 in the top number, which seems to be the desktop and it is perfect. Could you tell me what I did wrong? I thought I had done exactly what you did, but obviously screwed up. I'd like to know. THanks so much.

  • Mike_G JotForm Support
    Replied on January 19, 2019 at 12:26 AM

    It's possible that when you copied the codes provided by Ashwin you have replaced the original codes provided by Jonathan. Notice in the screenshot shared by Jonathan in his last reply that both codes are present.

    If you have other questions or concerns, please feel free to let us know.

  • deckerspence
    Replied on January 19, 2019 at 7:29 AM

    Yes, you are correct. Thank you for my education:)