Dawn 15.1.0 banner image blurry

[Tokiethebear]

Hello, I am using dawn version 15.1.0 and I managed to split the desktop and the mobile banner image into two separate images using the code below. However, the images are coming out slightly blurry. does anyone know of a solution to this problem? Thank you in advance.

.banner__media:first-child {

    width: 100%;

}

.banner__media+.banner__media {

    display: none;

}

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

    .banner__media:first-child {

        display: none;

    }

    .banner__media+.banner__media {

        width: 100%;

        display: block !important;

    }

}

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

    .banner__content::before{

        padding-bottom: 150% !important;

    }

}

[PageFly-Richard · Accepted solution]

This is Richard from PageFly - Shopify Page Builder App

Hi @Tokiethebear  can you check the image size again? The reason the image is blurry is because the image size is small and when applied to a large screen, it will be blurry.

Thank you.

Hope my solution will help you resolve the issue.

Best regards,

Richard | PageFly

[Tokiethebear]

Yeah I did do some tweaking to the image sizes this morning and that seemed to have done the trick. thank you, and I do apologize for wasting your time.

[PageFly-Richard]

No problem , You are always welcome. Have a nice day !