”Build a Quiz Webpage” step 34 - Question

Hello!

Why are we being asked to hide the text ”Question” as screen-reader only text, only to add it back again with a css ::before pseudoclass?

can you give a link of the page you are asking about?

It’s not really a question of how it functions, but about best practices for accessibility. Maybe it is just done like this to teach two different concepts (css flexibility & how to hide something from everything but screen readers), but it felt a bit redundant?

I think they might by trying to teach how ::before is not reliably accessible to screen readers. If that’s the intent, the instructions should say so explicitly. Without context, it does looks redundant and campers wont able to connects dots.