Mobile / responsive images squished

  • Resolved namgostar

    (@namgostar)


    9 years, 11 months ago

    I have an image in my front page slider.

    I added to my css, this code, so that it fills the whole width of the content area:

    .callbacks_container {
    width: 100%;
    }

    It looks great on desktop, but on mobile devices the slider image is squished. What code would I use to correct this?

    https://stearnsstrategicadvisors.com

Viewing 1 replies (of 1 total)

  • Hey there namgostar,

    You have slider image height defined to be 350px at all times https://screencast.com/t/WgHvedcAqxuP, that is the reason why the image is being squished on smaller resolutions.

    You can try adding some custom CSS to fix this, the easiest way to do that, if your theme doesn’t already have custom CSS tab, would be to add it in your site using the following plugin

    https://www.ads-software.com/plugins/simple-custom-css

    Once the plugin is installed and activated you can add this code to Appearance >> Custom CSS: 

    .rslides img {
height: auto!important;
}

.hp-slider-wrap {
height: auto;
}

    Please let me know if this helps ??

    Best regards,
    Bojan

Viewing 1 replies (of 1 total)
  • The topic ‘Mobile / responsive images squished’ is closed to new replies.