Payment field: Coupon box is overlapping product items

  • sofiman
    Asked on September 19, 2016 at 4:14 AM

    Hello

     

    I've a new form created and added a coupon code but the coupon field table is not well formatted with the form, if you would check.

     

  • Boris
    Replied on September 19, 2016 at 4:44 AM

    I've checked your form, and I see the issue you are reporting - your Coupon box has its border overlapping with your product items:

    Payment field: Coupon box is overlapping product items Image 1 Screenshot 40

    This is a minor design flaw, caused by the way the products are being presented. To rectify this, we simply need to "clear" the positioning from affecting the Coupon box. We can do this by injecting a small bit of custom CSS into your form:

    #coupon-container { clear: left; }

    You can add the above line of CSS into your form by following this guide, or by opening your form in the Designer, and pasting the code under the CSS tab of the Designer:

    Payment field: Coupon box is overlapping product items Image 2 Screenshot 51

    After adding it, your Coupon box will display like this:

    Payment field: Coupon box is overlapping product items Image 3 Screenshot 62

    Please try it out, and let us know if you run into any issues along the way or need further assistance. Thank you.

  • Boris
    Replied on September 19, 2016 at 5:00 AM

    Your last response didn't get through to our forum software, so I'll quote it here for relevance:

    Answered by sofiman

    Perfect! thanks

    You are most welcome, we're glad to hear it works to your satisfaction. If there is anything else we can do to help, please don't hesitate opening another support thread any time:

    https://www.jotform.com/contact

    Cheers :)