CSS calc(): clarify units usage (mdn#30457)

* Clarify units usage * Update files/en-us/web/css/calc/index.md Co-authored-by: Dipika Bhattacharya <[email protected]> * Update files/en-us/web/css/calc/index.md Co-authored-by: Dipika Bhattacharya <[email protected]> * Update files/en-us/web/css/calc/index.md Co-authored-by: Dipika Bhattacharya <[email protected]> * more clarity * more clarity * use glossary macro --------- Co-authored-by: Sideways S <[email protected]> Co-authored-by: Dipika Bhattacharya <[email protected]>
dvkam · Nov 27, 2023 · e113fe2 · e113fe2
1 parent 12e86bf
commit e113fe2
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/files/en-us/web/css/calc/index.md b/files/en-us/web/css/calc/index.md
@@ -18,18 +18,18 @@ The **`calc()`** [CSS](/en-US/docs/Web/CSS) [function](/en-US/docs/Web/CSS/CSS_F
 width: calc(100% - 80px);
 ```
 
-The `calc()` function takes a single expression as its parameter, with the expression's result used as the value. The expression can be any simple expression combining the following operators, using standard [operator precedence rules](/en-US/docs/Learn/JavaScript/First_steps/Math#operator_precedence):
+The `calc()` function takes a single expression as its parameter, and the expression's result is used as the value for a CSS property. In this expression, the {{Glossary("operand", "operands")}} can be combined using the {{Glossary("operator", "operators")}} listed below. When the expression contains multiple operands,`calc()` uses the standard [operator precedence rules](/en-US/docs/Learn/JavaScript/First_steps/Math#operator_precedence):
 
 - `+`
-  - : Addition.
+  - : Adds the specified operands.
 - `-`
-  - : Subtraction.
+  - : Subtracts the second operand from the first operand.
 - `*`
-  - : Multiplication. At least one of the arguments must be a {{cssxref("&lt;number&gt;")}}.
+  - : Multiplies the specified operands. At least one of the operands must be a {{cssxref("&lt;number&gt;")}}.
 - `/`
-  - : Division. The right-hand side must be a {{cssxref("&lt;number&gt;")}}.
+  - : Divides the left-side operand (dividend) by the right-side operand (divisor). The right-hand operand, the divisor, must be a {{cssxref("&lt;number&gt;")}}.
 
-The operands in the expression may be any {{cssxref("&lt;length&gt;")}} syntax value. You can use different units for each value in your expression, if you wish. You may also use parentheses to establish computation order when needed.
+All operands, except those of type {{cssxref("&lt;number&gt;")}}, must be suffixed with an appropriate unit string, such as `px`, `em`, or `%`. You can use a different unit with each each operand in your expression. You may also use parentheses to establish computation order when needed.
 
 ### Notes