Learn Accessibility by Building a Quiz - Step 8

HTML-CSS
1

Tell us what’s happening:

Can anyone explain the ‘max()’ function in CSS.

The “max” function has two values: “100px” and “18vw”. Where “100px” is minimum width and “18vw” is 18% increment as the viewport increases? If there is an increase in value of viewport by one value then the viewport will increase by 18%?

I’m still confused about “max” function. Can anyone help here :smiling_face_with_tear:

Your code so far


/* User Editable Region */

#logo img {
  width: max(100px, 18vw);
}

/* User Editable Region */

Your browser information:

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

Challenge: Learn Accessibility by Building a Quiz - Step 8

Link to the challenge:

2

Gr8 job you have the max attribute done correctly!

The issue is the selector. Instead of targeting the img element as well target just its id by typing # followed by the id name.
Ex:

#id{ }
3

I mean, I’m not getting the definition of the “max” function properly. Can you explain it or have any helpful resources about it ?

4

Got it now finally :smile: