Learn Accessibility by Building a Quiz - Step 67

[Lehoop]

All my searching to reach resolution has turned up with people saying they also struggled with this, and I have tried different forms of other examples of the same idea. I do not want to skip ahead to be given the code, I want to understand it.

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

The @media at-rule has a media feature called prefers-reduced-motion to set CSS based on the user's preferences. It can take one of the following values:

reduce
no-preference
@media (feature: value) {
  selector {
    styles
  }
}
Wrap the style rule that sets scroll-behavior: smooth within an @media at-rule with the media feature prefers-reduced-motion having no-preference set as the value.

* {
  @media (prefers-reduced-motion: no-preference) 
  }

body {
  background: #f5f6f7;
  color: #1b1b32;
  font-family: Helvetica;
  margin: 0;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36

Challenge: Learn Accessibility by Building a Quiz - Step 67

Link to the challenge:

freeCodeCamp.org

[Cody_Biggs]

Please paste your full code. You can use the format button that looks like </>. Paste your entire code between the two lines it gives you.

[Lehoop]

Edit, I figured this out, and to help others who stumble upon this issue, here is my resolution walk through that helped me get there.

The example is

@media (feature: value) {
selector {
styles
}
}
So you just need to remember that the “selector” is in reference to the portion of the coding that you are focussing on. in this case, “*”. with this knowledge, the rest should fall in place. /Do not start with * { @media/