How can i make form responsive on iphone 5c

  • Profile Image
    mark 
    Asked on March 19, 2014 at 07:15 AM

    I've even tried going through the form and replacing the revelant tags tried other options myself but nothing works the site is http://clairebrownrealty.com/cbr-aqua/CBR_aquaboracay_SMART_march2014.html please help

     

     

    I've tried following "

    Our forms are already optimized for mobile views so it is built in on the forms already. However, if you'd like to customize it further, you can use this CSS code as an example:

     

    /*-----------RESPONSIVE LAYOUT-----------*/

    @media (max-width: 480px) {

    .form-textarea,

    .form-textbox,

    .form-dropdown{

    width: 100% !important;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

    }

    .form-label-left, .form-label-right{

    width: auto;

    }

    .form-buttons-wrapper{

    margin-left:0 !important;

    }

    .form-input {

    width: 100%;

    }

    .form-all{

    width: 75%;

    }

    .form-sub-label-container {

    width: 100%;

    display:block;

    }

    }

    Simply inject this CSS to your form. How to Inject Custom CSS Codes to your Form

    Here's a demo: http://www.jotformpro.com/form/31362999175971, try resizing the browser window width and see how the form reacts.

    Let us know if you have further questions. Thanks!!"

  • Profile Image
    pinoytech
    Answered on March 19, 2014 at 11:32 AM

    Hi Mark,

    Upon checking source code of your website, I found out that you are not using JotForm form which is the reason why Custom CSS code is not working in your form.

    The only way to work this custom css code to make a form optimize for mobile views, you need to use JotForm form.

    You can check this form that I've created: http://www.jotformpro.com/form/40774745397973

    How can I use this form?

    Please follow this simple steps:

    1. Register to JotForm

    2. Clone this form

    3. Embed it in your website

    If you need further assistance, pleae feel free to contact us again at anytime.