31 lines
747 B
Plaintext
31 lines
747 B
Plaintext
To perform calculations when specifying a CSS property ``++calc()++`` function can be used. This function takes single expression as parameter. When writing this expression some rules must be respected:
|
|
|
|
* no empty ``++calc()++``
|
|
* there should be an operator between the arguments, spacing should be respected
|
|
* there should not be any division by zero
|
|
* the resolved type should be valid for where the expression is placed
|
|
|
|
Otherwise ``++calc()++`` function will be invalid and the entire rule using it will be ignored.
|
|
|
|
|
|
== Noncompliant Code Example
|
|
|
|
----
|
|
.btn {
|
|
border: solid black 1px;
|
|
width: calc(100% 80px); /* Noncompliant */
|
|
}
|
|
----
|
|
|
|
|
|
== Compliant Solution
|
|
|
|
----
|
|
.btn {
|
|
border: solid black 1px;
|
|
width: calc(100% - 80px);
|
|
}
|
|
----
|
|
|
|
|