-
bodiallegianceAsked on October 5, 2016 at 5:26 PM
At the moment I have the mobile widget on my form, however when I view the form on IOS device, it doesnt fit the screen and it cuts off half of my information. Any suggestions?
-
Kevin Support Team LeadReplied on October 5, 2016 at 10:29 PM
I have checked your form and I can see what you're referring to, here is also a screenshot about what I can see on my end:
The problem only seems to happen in IOS since I have tested in an Android device and seems like the form loads properly, here is a screenshot:
I would suggest you to apply this CSS code to your form:
/*-----------RESPONSIVE LAYOUT-----------*/
.form-line.form-line-column {
width: 100% !important;
margin-left:0;
}
.form-line{
width: 100%;
}
.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 !important;
}
.form-buttons-wrapper{
margin-left:0 !important;
}
.form-input {
width: 100% !important;
}
.form-all{
width: 75% !important;
}
.form-sub-label-container {
width: 100% !important;
display: block !important;
}
It will also help the form to load properly in mobile devices, here is a guide that will help you to inject the code to your form: How-to-Inject-Custom-CSS-Codes
Please after doing this, re-embed your form using the iFrame code, here is the guide: Getting-the-form-iFrame-code
Do let us know how it goes.