How to use sass math.div?

support
1

I have this problems when i write
//@function percent($px, $from) {
// $result: math.div($px, $from) * 100%);
// @return $result;
//}

in browser:
Compiled with problems:X

ERROR in ./src/components/sccs/style.scss (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[1].oneOf[7].use[3]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[7].use[4]!./src/components/sccs/style.scss)

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Invalid CSS after " $result: math": expected expression (e.g. 1px, bold), was “.div($px, 16) + rem”
on line 20 of src/components/sccs/mixins.scss
from line 5 of src/components/sccs/style.scss

$result: math.div($px, 16) + rem;
--------------^

I use dart last version, but i don’t understand what is’s the problem

2

First, it looks like you’re using Node.js to transpile your Sass to CSS, so at its core this is not a Hugo problem.

Second, there’s an extra parenthesis:

$result: math.div($px, $from) * 100%);

should be:

$result: math.div($px, $from) * 100%;
3

I’ve written another $result: $px / $from * 100% and it’s working)

4

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.