Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Sass Basics Write Smart and Efficient CSS with Sass Create a Function for Flexbox Layout

Andy Goodman
Andy Goodman
14,207 Points

Incompatible units error

The function does not seem to work for me, I get the following console error when saving:

error scss/utilities/_functions.scss (Line 12: Incompatible units: '' and 'px'.)

Line 12 is: @return (100% / $gutter) - $g-total;

from this function which is as per Guil's code:

@function per-line($items) { $g-pct: px-to-pc($gutter) * 2; $g-total: $items * $g-pct; @return (100% / $gutter) - $g-total; }

It seems it does not like multiplying a % be a px ($gutter). Has Sass been updated and no longer allows this, or am I just doing something wrong?

In _vairable.scss gutter is set as: $gutter: 10px; (again, just like in the video)

1 Answer

You may have moved on or figured this out already as it has been quite a while, but my line 12 is different.

Mine is as follows: @return (100% / $items) - $g-total;

Looks like you're trying to divide 100% by a pixel value, as opposed to diving it by an integer.

Hope this helped.