Unable to render stars in IE

up

UP

Hi all!

Thank you for reaching out to us!
As much as we’d love to continue supporting Internet Explorer we cannot.
https://www.microsoft.com/en-us/microsoft-365/windows/end-of-ie-support

Internet Explorer is missing the newer libraries/styles that are required for Strong Testimonials to look and function correctly. This is unfortunately out of our control, and we do recommend that users keep their browsers up to date for the best possible experience.
Strong Testimonials works perfectly well on Microsoft Edge which is the official replacement browser for IE.

Thank you for understanding.

Warm regards,
Mihaela

• This reply was modified 4 years, 3 months ago by Miha. Reason: grammar

Thanks for your response! ??

@mplusb
I would like to offer a solution. This can be fix by using the solution that wordpress used. By using font family dashicons and using characters \f155 for star-solid, \f459 for star-half and \f154 for star-regular
My solution is like this:

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .strong-rating span.star::before {
        content: "\f155";
        font-family: dashicons, serif;
        text-align: center;
        background: transparent;
    }
    .strong-rating-wrapper.average .strong-rating span.star.half::before {
        content: "\f459";
    }
    .strong-rating span.current ~ span.star::before {
        content: "\f154";
    }

    .strong-rating label::before {
        content: "\f155";
        font-family: dashicons, serif;
        text-align: center;
        background: transparent;
    }
    .strong-rating-wrapper.in-metabox .strong-rating > label::before {
        background: transparent;
    }
    .strong-rating-wrapper.in-metabox input[type='radio']:checked + label::before {
        background: transparent;
    }
    .strong-rating input:checked ~ label::before {
        content: "\f154";
    }
    .strong-rating:hover input ~ label::before, .error .strong-rating:hover input ~ label::before {
        content: "\f155";
    }
    .strong-rating input[type='radio']:checked + label::before, .error .strong-rating input:checked + label::before {
        content: "\f155";
    }
    .strong-rating:hover input:checked + label::before, .error .strong-rating:hover input:checked + label::before {
        background: transparent;
    }
    .strong-rating:hover label:hover ~ input:not(:checked) + label:before {
        content: "\f154";
    }
}

This solution will only apply on IE 11 and will leave other browsers.

• This reply was modified 4 years, 3 months ago by dmcpro.
• This reply was modified 4 years, 3 months ago by dmcpro.