Passing 0 to pxtorem causes exceptions

Created on 15 June 2023, over 1 year ago
Updated 14 June 2024, 6 months ago

Problem/Motivation

If you pass 0 as (one of) the parameters to the pxtorem mixin it results in the following exception;

0px^-1 isn't a valid CSS value.

However, passing 0 to pxtorem is very useful because it can be used (for example) to set all four paddings in one line;
padding: pxtorem(0, 10px);
Or;
padding: pxtorem(10px, 0, 0, 10px);

Because of the exception, you currently have to use the following code to have the same effect;
padding: 0 pxtorem(10px);
Or;
padding: pxtorem(10px) 0 0 pxtorem(10px);

Steps to reproduce

Add the following line to any element in your SASS file;
padding: pxtorem(0, 10px);

And try to compile the SASS files.

Proposed resolution

In the mixin pxtorem check if $item is equal to zero and if so, just add '0 ' to $result.

Feature request
Status

Fixed

Version

5.0

Component

Code

Created by

🇳🇱Netherlands Rik Wijnen

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024