chriseppstein/compass — Issue #639: compass/reset is preventing Google fonts from loading
Author: tinyclanger
Created: 2011-12-03 18:09:34+00:00
State: open

My `application.css.scss` contains this:

```
/*
*= require_self
*/

@import "bourbon";
@import "compass/reset";

@import "common";
```

with `common.css.scss` starting:

```
@import url(http://fonts.googleapis.com/css?family=Rokkitt:700|Lato:400italic,400,700,700italic|Inconsolata);

body, p, ol, ul, td {
font-family: 'Lato', 'Calibri', 'Helvetica', 'Arial', sans-serif;
}
```

The body text displays in Calibri. If I remove the include of compass/reset, the body text correctly displays in Lato — but then the page layout gets destroyed, of course.

Examining the Resources tab in Safari's element inspector shows the fonts aren't even loaded when compass/reset is included.

It worked fine when the require_tree was still in place, rather than loading the stylesheets individually, but I wanted to use bourbon and this doesn't work with require_tree.

I really don't want to have to include all the resets at http://compass-style.org/reference/compass/reset/utilities by hand, bar the one that's causing the problem (and especially since that page isn't exactly clear on how to load individual resets!) Is it just that I'm loading things in the wrong order? I can't be the first to use compass/reset with Google fonts :)

I'm using Rails 3.1.3, sass-rails 3.1.5, compass 0.11.5 and sass 3.1.11.