Design/Placement of Fields within a Module

  • ewinder
    Asked on February 5, 2016 at 4:17 PM

    My question is two-fold:

    1.  Is there a way to move around the fields within the Address Block?  For instance, can we move the zip code to the right of the state?

     

    2.  The expiration month and year fields within the payment wizard are on top of one another instead of on the side of each other.  I haven't seen it do this before.  Please advise as to why that might be.

     

    Thank you!

  • Kevin Support Team Lead
    Replied on February 5, 2016 at 6:50 PM

    Try injecting this CSS code: 

     

    input#input_34_postal{

        position: absolute;

        margin-left: 32%;

        margin-top: -50px;

        width: 15%;

    }

     

    label#sublabel_34_postal{

        position: absolute;

        margin-left: 33%;

        margin-top: -23px;

    }

     

    select#input_3_cc_exp_year{

        position: absolute;

        margin-left: 35%;

        margin-top: -38px;

        width: 30%;

    }

     

    label#sublabel_cc_exp_year{

        position: absolute;

        margin-left: 36%;

        margin-top: -14px;

    }

    Hope this helps.

  • ewinder
    Replied on February 12, 2016 at 4:35 PM

    Thank you, but where exactly do I enter this code?  I went into the Designer and clicked on CSS, but I'm not sure exactly where I add it in.  Do I click on the corresponding field and then copy and paste it into there?  The first two refer to the postal code and the last two refer to the expiration year so I'm not sure.  Thank you for your help!

  • Kevin Support Team Lead
    Replied on February 12, 2016 at 11:53 PM

    Yes, you may follow the guide provided above: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Also, pasting the code in the Designer as shown in the image below.

    Design/Placement of Fields within a Module Image 1 Screenshot 20