Increasing form width for mobile compatibility

Hello, 

Is there anyway for the form background to cover the entire extent of the questions and the options? I have tried increasing the form width, but it looks the same on mobile. 

As you can see in the screenshot, the questions extend from the white into the blue background. 

Can you please try injecting the custom CSS codes below to fix the issue you are having?

@media screen and (max-width: 480px){

.form-product-child-table{

  display: block !important;

  position:relative !important;

  left: -35px !important;

}

}

Feel free to let us know if you need any further assistance.

Reference Guide: How-to-Inject-Custom-CSS-Codes

That made it a better for portrait mode; however, there is still a bit hanging off as pictured. It is also still hanging off in Landscape mode. 

I believe I fixed it for portrait mode, I just edited the left px to -60. 

Please allow me some time to check this further. I'll get back to you in some time.

Thanks

Could you please check this Cloned form:

https://form.jotform.com/201502048257952

@media screen and (max-width: 480px),  screen and (max-device-width: 415px) and (orientation: portrait){
  .form-line[data-payment="true"] .form-product-item .form-product-item-detail {

display: contents;
}
.form-line[data-payment="true"] .form-product-item .form-product-container {
 
  position:relative;
  width: 80%;
  top: -48px!important;
  left: 26%!important;
}

.form-product-child-table {
  position: relative;
  top: -30px;
  height: 100px;
}

.form-line[data-payment="true"] .form-product-item .form-special-subtotal {

  position: relative;
  right: -10px;
}
.form-line[data-payment="true"] .form-product-item .form-product-container .form-product-name {
width: 220px;
}
 
}

I have injected the above CSS in my form. Let us know how it goes.

Thanks.

Hello,

We are sorry for the issue.

The issue is fixed.

Could you please clear the form caches?

Thank you.

Everything works well now, thank you.