Question

When I try to use linear-gradient with bourbon:

@include linear-gradient(#8080a0, #606090);

I get this:

background-color: #8080A0;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(100%, compact(#8080A0, #606090, false, false, false, false, false, false, false, false)));
background-image: -webkit-linear-gradient(top, compact(#8080A0, #606090, false, false, false, false, false, false, false, false));
background-image: -moz-linear-gradient(top, compact(#8080A0, #606090, false, false, false, false, false, false, false, false));
background-image: -ms-linear-gradient(top, compact(#8080A0, #606090, false, false, false, false, false, false, false, false));
background-image: -o-linear-gradient(top, compact(#8080A0, #606090, false, false, false, false, false, false, false, false));
background-image: linear-gradient(top, compact(#8080A0, #606090, false, false, false, false, false, false, false, false));

which seems to indicate that compact() is not called. It is defined in a separate file in a place called lib/bourbon/sass_extensions/functions/compact.rb. How can I get that loaded?

Solved

The problem seemed to be with bourbon itself. I was using version 2.1.3, which had the problem. The authors have been updating it in these few days, and they added a new version 3.0.1, which is working.

Was it helpful?

Solution

Is this Stackoverflow answer helpful for getting your compact function working?

Original Answer to Original Question (for posterity)

compact() is not valid CSS. Your generated CSS contains multiple references and Chrome disregards rules it doesn't know how to interpret.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top