Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #894926

    I have a Grid Row that has two columns in it. Each column has an Image element in it. How do I get those images to continue scaling even after they have reached their full size so they continue to fill the screen?

    I have tried to add CSS to each image but it doesn’t seem to work?

    .imagescale {
    width: 100% !important;
    height: auto !important;
    max-width:100% !important;
    }

    • This topic was modified 6 years, 10 months ago by scottvarga.
    #894998

    Hey Scott,

    Can you provide a link to the site/page in question so we can look into this further?

    Best regards,
    Jordan Shannon

    #895004

    Here is a link to the page

    If you go halfway down the page you will see four images of a booklet. These images are 900px wide so once the browser gets to about 2000px wide you start to see them separate out a bit with.

    #895116

    Hi,

    It looks like you are not targeting the actual images, maybe this will work?

    .imagescale img {
    width: 100% !important;
    height: auto !important;
    max-width:100% !important;
    }

    Best regards,
    Rikard

    #895385

    That didn’t seem to work? I even tried putting the CSS Class on the cell as well as the image.

    #895439

    Hi,

    Have you made sure to hard clear the cache a few times over?

    Best regards,
    Jordan Shannon

    #895467

    I viewed it in a browser that I have never accessed that page before with so I don’t think that matters.

    #897060

    Hi,

    Try adding this css code:

    .imagescale .avia-image-container-inner {
        display: block;
        width: 100%;
    }

    Let us know if this helps.

    Best regards,
    Nikko

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.