How can I make this form display correctly on Safari?

  • StuartG94
    Asked on March 7, 2014 at 10:04 AM

    Hi there, the JotForm support guys helped me out yesterday with a form I was trying to get right for a client of mine but it turns out he is using Safari and their are some issues with the way it displays. I need the form to look and function correctly on Safari as we got it working correctly on IE now we need to get it right on Safari if someone can please help me.

    http://form.jotformeu.com/form/40632395583358

    How can I make this form display correctly on Safari? Image 1 Screenshot 20

  • pinoytech
    Replied on March 7, 2014 at 11:49 AM

    Hi,

    I've updated custom css of the form. Kindly remove/delete current css code in your form and replace it with this code.

    .form-all {

    border: 1px solid #b7bbbd;

    height: 360px !important;

    }

    .form-all input,select {

    border: 1px solid #b7bbbd;

    -webkit-border-radius: 5px;

    -moz-border-radius: 5px;

    border-radius: 5px;

    padding: 4px;

    width: 180px;

    }

    .form-textarea {

    border: 1px solid #b7bbbd;

    -webkit-border-radius: 5px;

    -moz-border-radius: 5px;

    border-radius: 5px;

    padding: 4px;

    min-width: 217px;

    max-width: 217px;

    }

    .form-dropdown {

    border:1px solid #323232;

    background: #323232 !important;

    }

    .form-line-error {

    background: none;

    }

    .form-error-message {

    display: none !important;

    }

    .form-line.form-line-column {

    width: 190px !important;

    }

    #id_7 {

    top: -222px !important;

    width: 220px !important;

    display: -moz-inline-stack;

    display: inline-block;

    }

    #input_8_0.form-checkbox {

    width: 15px !important;

    }

    #input_6 {

    width: 188px !important;

    color: #F2D829 !important;

    }

    #id_9 {

    top: -155px !important;

    left: 213px !important;

    display: -moz-inline-stack;

    display: inline-block;

    }

    .form-captcha {

    border: none !important;

    background: none !important;

    }

    .form-submit-button, .form-submit-reset, .form-submit-print, .form-screen-button {

    width: 100px !important;

    height: 30px !important;

    text-align: center;

    background: #323232;

    color: #F2D829 !important;

    text-shadow: none;

    }

    .form-submit-button:hover {

    width: 100px !important;

    height: 30px !important;

    text-align: center;

    background: #323232;

    color: #FFFFFF !important;

    text-shadow: none;

    }

    #id_10 {

    padding: 0px 0px 0px 7px !important;

    margin-top: -20px !important;

    }

    #id_3, #id_4, #id_,5 #id_8, #id_6, #id_9 .form-line.form-line-column {

    height: 45px !important;

    }

    #id_2 {

    top: -217px !important;

    }

    Feel free to contact us again if you need further assistance.