I need serious help here in @media (prefers-reduced-motion: no-preference)

HTML-CSS
#1

Tell us what’s happening:

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.

* {
  scroll-behavior: smooth;
}

Your browser information:

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

Challenge: Step 66

Link to the challenge:

1 Like
#2

Step 66

Setting the scroll-behavior to smooth is preferred by most users. However, some users find this to be too slow, and prefer to have the scrolling happen instantaneously.

There exists a media rule to set CSS based on the user’s browser settings. This media rule is called prefers-reduced-motion, and expects one of the following values:

  • reduce
  • no-preference

Wrap the appropriate rule within a prefers-reduced-motion media rule such that a scroll-behavior of smooth is only set if the user’s browser setting is no-preference.

1 Like
#3

Moderator edit the answer out

1 Like
#4

it didn’t work for me, unfortunately

#5

so it seems that the @media rule needs to be specified.

Moderator edit the answer out

#6

Moderator edit the answer Out

1 Like
#9

It’s nice that every one cleared the challenge, but the forum is about helping and deduct solution, It would be lovely to help people come up with the solution too. Instead of outright giving solutions

#10