The form width changed when an option from DDslick Dropdown widget is selected

  • Profile Image
    plungefetish1
    Asked on September 08, 2019 at 06:36 PM

    My form : https://www.jotform.com/92263485568166

    My form is embbeded here https://plungefetish.com/rates.php

    The form works fine in desktop but on my iphone it does not work .   On my iphone when I open up the drop down menu of the DDslick labeled "Airport Transfer" it looks good, but when I make a selection from the drop down menu it makes the entire form stretch out left to right.  

    I've recorded a GIF on my iphone and uploaded it to my site.  You can view it here: 

    https://plungefetish.com/images/4982.gif

    The GIF will show you the problem.

  • Profile Image
    BDAVID
    Answered on September 08, 2019 at 07:59 PM

    Please try removing this line of code: width:310px!important;

    1567986835bad.png

    And use this instead: width: 98% !important

    1567986854good.png

    Also, make sure to put the enclosing curly bracket your @media code:

    1567986939close.png

    That should prevent the resizing issue in mobile views. Let us know if you need more help, we will be glad to assist you.

  • Profile Image
    plungefetish1
    Answered on September 09, 2019 at 01:13 AM

    I made those changes and got the same result as before.  It becomes too big for the screen

  • Profile Image
    Nik_C
    Answered on September 09, 2019 at 05:37 AM

    I added this line to your widget's CSS:

    .dd-selected-description-truncated {

        white-space: pre-wrap!important;

    }

    Please check "Airport Transfer" it should be fine.

    Thank you!

  • Profile Image
    plungefetish1
    Answered on September 09, 2019 at 07:43 AM

    It is still not working correctly.   I am using an iphone 

  • Profile Image
    Welvin
    Answered on September 09, 2019 at 09:23 AM

    I think you have not added the custom CSS codes. I cannot find that in the form. I've added that for you and checked, all good now. Can you check again to your end to confirm?

  • Profile Image
    plungefetish1
    Answered on September 09, 2019 at 04:07 PM

    It is not all good now.  

    When I use the form on my Iphone and select one of the airport transfer options from the airport transfer DDslick all of the fields become elongated and stretch off the screen.  

    Where did you see that it is all good now?

    The problem occurs on the mobile version of the form.

  • Profile Image
    Nik_C
    Answered on September 09, 2019 at 04:20 PM

    I tested your form and it's working properly, I tested on iPhone 7:

    156806028240782.jpg

    If the issue persists on your website, please try re-embedding your form.

    Thank you!