How can I change the text color and text align of the autosize widget?

  • Profile Image
    FRJotform
    Asked on May 12, 2017 at 06:59 AM

    I'm using the TextArea Autosize widget and would like to make the text within the box align to the centre, and also change the text colour and size.

    Could someone tell me the correct CSS to do that?

    There is a field in the widget setting to insert custom CSS and I have tried the following but it doesn't work - 

    text-align : center;

      color : blue ;

    }

  • Profile Image
    amy
    Answered on May 12, 2017 at 08:08 AM

    Hi,

    Please try injecting the following CSS codes instead of the current one:

    #autosizeText {

        color: blue;

        text-align: center;

    }

    The result should be the same as the screenshot:

    If you need further assistance, please feel free to ask.

    Thank you for contacting us.

    Regards.

  • Profile Image
    FRJotform
    Answered on May 12, 2017 at 08:43 AM
    Thank you – one more question, is it possible to make this text field read-only?
    I can’t find that option on it but is it possible to inject custom CSS to do this?
    ...
  • Profile Image
    EltonCris
    Answered on May 12, 2017 at 09:51 AM

    You can make the field read-only in the form builder. Here's how:

    1. While in the form builder, click the field

    2. Open its properties (click the cog icon)

    3. Go to Advanced tab then enable Read-Only.

  • Profile Image
    FRJotform
    Answered on May 12, 2017 at 10:44 AM
    There isn’t a read-only option on the Textarea Autosize widget.
    Is it possible to add custom CSS to make it read only?
    ...
  • Profile Image
    EltonCris
    Answered on May 12, 2017 at 11:09 AM

    Yes, there's a CSS trick to make the field not clickable. Use the following.

    Paste it inside the widget settings under custom CSS tab.

    textarea#autosizeText {

        pointer-events: none;

    }