How to format the box to look like the rest of the form?

  • Max_Gordon
    Asked on December 27, 2020 at 5:02 PM
    Is there any possibility of formatting the box to look like the rest of the form?
  • Kenneth JotForm Support
    Replied on December 27, 2020 at 5:45 PM

    Hi there,

    After customizing the form here is how it looks:

    1609108875 5fe90d8b161c1 y1 Screenshot 10

    If that is acceptable, then please insert these codes into the Widget's Custom CSS Area:

    1609109043 5fe90e33d6baa u1 Screenshot 21

    iframe#customFieldFrame_37 {

      max-width: 48%!important;

      height: 3em !important;

    }

    input#maskedInput {

      width: 100% !important;

      border-color: rgba(17, 17, 27, 0.75);

      background-color: #838895;

      color: #2c3345;

      height: 100% !important;

      font-size: 1.2em;

      border-radius: 4px;

      border: 1px solid;

      display: block;

      padding: 0 .625em;

      outline: 0;

      margin: 0;

      text-align: left;

      max-width: 100% !important;

      max-height: 100% !important;

      box-shadow: none !important;

      font-family: Arial !important;

    }

    iframe#customFieldFrame_38 {

      max-width: 48%!important;

      height: 2.6em !important;

    }

    input#maskedInput {

      width: 100% !important;

      border-color: rgba(17, 17, 27,0.75);

      background-color: #838895;

      color: #2c3345;

      height: 100% !important;

      font-size: 1.2em;

      border-radius: 4px;

      border: 1px solid;

      display: block;

      padding: 0 .625em;

      outline: 0;

      margin: 0;

      text-align: left;

      max-width: 100% !important;

      max-height: 100% !important;

      box-shadow: none !important;

      font-family: Arial !important;

    }

    I hope that helps.

    Best.

  • Max_Gordon
    Replied on December 27, 2020 at 9:11 PM

    Perfect! Thank you so much! This helped out!