I found a question in the CSS Relative and Absolute Units Quiz that lacks necessary context: “What happens with calc(10px + 20%) in CSS?”
Technically, this question is undefined because the behavior of % depends entirely on the property being used. I’m guessing it assumes a width context, but % behaves differently for font-size, line-height, or transform. Yes, I can use context clues in this case, but it may send the wrong message to some users: that calc(10px + 20%) must always refer to width. In reality, this is only true for specific properties, and teaching it without that context can lead to confusion later on.
I just found this kind of frustrating because I’m fairly certain what the answer is, but that’s because most of the other choices are so bad. Am I taking a test on CSS, or a test on how to spot bad answers on a test? Ok that was kind of snarky, but I mean no harm, just trying to make a point.
Suggestion:
width: calc(10px + 20%)
