HD Quiz

Hi Afiur,
thanks for providing a link, and checking your cache.

First, this is not a mobile issue. This is still almost certainly a caching issue.

For example, I see that the styles for “correct” and “incorrect” answers are not being applied even on desktop for me. HD Quiz is correctly marking and adding the correct classes to the answers, but your site does not actually have the styles!

If I were to guess, the reason you think that it works on desktop for you, but not mobile, is that you are logged into the site on desktop, but not mobile. Because you are logged in, you are not seeing the cached version of the site, and thus it works.

How to fix
I see that you are using LiteSpeed for your page caching. LiteSpeed is great and is fully compatible with HD Quiz. I even use it right here on this site 🙂

However, I see that you are using UCSS which is probably the cause. The way that feature works is that it renders the page, and scans the content for any styles. It throws away any styles that are not used. The problem is that on page load, the quiz is not marked (obviously). The quiz only marks and adds the styles for marking once a user has completed the quiz. Because of this, the UCSS feature in LiteSpeed does not add the styles needed to visually mark correct and incorrect answers.

Normally none of this would be an issue, but something about your unique combination of setings with UCSS, guests, etc is causing litespeed to not include the needed styles.

Log into your site and go to:
LiteSpeed Cache ⇾ Page Optimization ⇾ Tuning – CSS.

Under “CSS Excludes” and “UCSS File Excludes and Inline” add hdq_style.css. Theoretically, this should tell LiteSpeed to always include the full styles for quizzes whenever a quiz loads.