Inventory Widget: How do I display the widget properly on mobile devices?

Please help me adjust the width of my inventory widgets: https://form.jotform.us/72294498260161

Right now, they are too wide and get cut off on the right side on the mobile view. Thanks!

Please inject the following CSS code to your form in order to display the widgets properly on mobile devices: 

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

  iframe[src*="inventory"]{

      width: 88% !important;

      height: 80px !important;

  }

}

This guide will help you injecting the code: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

You can see the result on this cloned form of yours: https://form.jotformpro.com/72296196056969

I hope this helps. 

Thanks for your quick response! I tried the code but it is not doing anything when I use the advanced designer to look at the mobile view in portrait mode. I'm wondering if there are other CSS codes already in the form that are causing a conflict??

I have reviewed your form and noticed the code is being applied: 

Do note that you may either increase or decrease the width and height values, this way your fields display properly and they do not cut off on mobile devices. 

Please let us know how it goes.