Tagged: 

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1128316

    I created a full-width color section with an image to fill 75% of browser height. I uploaded the 4k image and designed it for 4k. the image appears great on my 4k monitor, but on my coworkers’ 720p monitors the image is zoomed way in. i understand the concept of why it is doing this, but is there a way to fix the scaling so the 4k images downsample into the 720 container rather than zooming way in?

    link to screenshots of my same page on 2 different resolution displays: https://www.dropbox.com/sh/wr5yry1nh4cxe1y/AAAD6nTD3O5FjHHAq4b1tB4ya?dl=0
    link to site that correctly displays the same image consistently across display resolutions: https://www.gmc.com/trucks/sierra/1500/sle-elevation-slt

    Thanks!
    Ryan

    #1128606

    Hey ryanmeighan,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    #1128936

    Hello! Here is the page in question:

    https://mydomain.com/maxtemp/

    Thanks,
    Ryan

    • This reply was modified 2 months ago by Yigit.
    #1129400

    Hi,

    Thank you for using Enfold.

    The image in the color section is set as background via css, so it’s possible to apply a smaller version of the image for lower screen resolutions using css media query.

    @media only screen and (max-width: 1600px) {
        #av_section_1 {
            background-image: url("https://yourdomain.com/wp-content/uploads/2019/08/Max-Header-Small.jpg") !important;
        }
    }

    Adjust the image URL. You can also replace the selector “av_section_1” with the color section’s Section ID.

    Best regards,
    Ismael

    • This reply was modified 2 months ago by Yigit.
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.