Design/Placement of Fields within a Module

  • Profile Image
    ewinder
    Asked on February 05, 2016 at 04: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!

  • Profile Image
    Kevin_G
    Answered on February 05, 2016 at 06: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.

  • Profile Image
    ewinder
    Answered on February 12, 2016 at 04: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!

  • Profile Image
    Kevin_G
    Answered 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.