How can I adjust the height of the slide show for mobile devices?

  • Profile Image
    Buschmarketing1963
    Asked on October 22, 2019 at 09:12 AM

    I want to optimize the form for mobile.

    However, the height of the slide show element can't be defined via CSS.

    It looks like there are inline styles in the html and I don't know where to change them.

    1571749911SlideShowMobile.JPG

    1571749900SlideShowMobile_code.png




    Screenshot
  • Profile Image
    Richie_P
    Answered on October 22, 2019 at 11:36 AM

    I have checked your form and it seems you have added the custom CSS inside your widget.

    May we know what kind of adjustments would you like with image slider widget?

    You may try this custom CSS to increase the height of the slider image.

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

    .slidesjs-slide{
    height:320px !important;
    }
    }

    Looking forward for your response.

  • Profile Image
    Buschmarketing1963
    Answered on October 25, 2019 at 08:33 AM

    Hi,

    unfortunately, it didn't change anything. Still the height did not change.

  • Profile Image
    Richie_P
    Answered on October 25, 2019 at 09:39 AM

    I have checked your form and it seems you have removed your custom CSS in the widget.

    The custom CSS I have shared seems to be working at my end. You can adjust the height to 200px;

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

    .slidesjs-slide{
    height:200px !important;
    }
    }

    Screenshot:

    If you want to change the height in the normal view, you can remove the @media query CSS.

    .slidesjs-slide{
    height:200px !important;
    }


    Please give it a try and let us know how it goes.