How do I improve consistency in box width?

  • Profile Image
    kristyhunt
    Asked on May 08, 2013 at 10:59 AM

    How can I make the boxes and labels all the same width on the form? I like the "shrink" feature for such little information-containing fields. But this looks so amateur. Can you help me fix this please?

  • Profile Image
    jefreylandicho
    Answered on May 08, 2013 at 11:22 AM

    Aside from the shrink function, you can inject a custom CSS in your form styles to adjust the label and box width size.

    For your form case, the first thing you would do is grab the form field ID.  Using Google Chrome browser, you can do get the ID by right clicking the field then click the Inspect Element menu.

    Inside your form, go to Setup & Embed then click the Preferences Icon to open the preferences window. Select the Form Styles tab and add the code in the Inject Custom CSS field area as shown below. 

    e.g.  #input_4  { width: 400px;  }  /* wherein input_4 is the Form Field ID and 400px is the size value that can be change anytime */

    Another approach in resizing a field width is by using the Size Icon. To show the Size Icon, you will first need to select the field. 

    If you need further assistance, please contact us again.