Susy 2 Show-Grid background-image not found - grid

Question

I having trouble trying to show the debug grid from susy 2.
base on this sample:
http://sassmeister.com/gist/9533822
I use
body
{
#include container(show);
}
but what Developer Tool Return is:
https://www.dropbox.com/s/pskhjvwd631jux6/Screenshot%202014-08-24%2015.31.37.png?dl=0
the SVG Grid is not there
I start thinking of my gulp Config:
// Include gulp
var gulp = require('gulp'),
// Include Our Plugins
sass = require('gulp-ruby-sass'),
compass = require('gulp-compass'),
prefix = require('gulp-autoprefixer'),
minifycss = require('gulp-minify-css'),
jshint = require('gulp-jshint'),
uglify = require('gulp-uglify'),
imagemin = require('gulp-imagemin'),
rename = require('gulp-rename'),
rimraf = require('gulp-rimraf'),
concat = require('gulp-concat'),
notify = require('gulp-notify'),
cache = require('gulp-cache'),
plumber = require('gulp-plumber');
livereload = require('gulp-livereload');
//Sass
gulp.task('styles', function() {
return gulp.src('_scss/*.scss')
.pipe(plumber())
.pipe(compass({
// Compass settings that would otherwise go in config.rb
sass: '_scss',
css: 'resources/css',
image: 'resources/img',
//environment: 'production',
//environment: 'development',
style: 'expanded',
relative: true,
//noLineComments: true
require: ['susy', 'breakpoint']
}))
.pipe(prefix({ cascade: true }))
.pipe(gulp.dest('resources/css'))
.pipe(rename({suffix: '.min'}))
.pipe(minifycss())
.pipe(gulp.dest('resources/css'))
.pipe(notify({ message: 'Styles task complete' }));
});
// Concatenate & Minify JS
gulp.task('pluginsjs', function() {
return gulp.src(['_coffeescript/_plugins.js'])
.pipe(plumber())
.pipe(gulp.dest('resources/js'))
.pipe(rename({basename:'plugins', suffix: '.min'}))
.pipe(gulp.dest('resources/js'))
.pipe(notify({ message: 'Plugins javascript task complete' }));
});
gulp.task('mainjs', function() {
return gulp.src(['_coffeescript/_main.js'])
.pipe(jshint())
.pipe(jshint.reporter('default'))
.pipe(plumber())
.pipe(gulp.dest('resources/js'))
.pipe(rename({basename:'main',suffix: '.min'}))
.pipe(uglify())
.pipe(gulp.dest('resources/js'))
.pipe(notify({ message: 'Main javascript task complete' }));
});
// Optimize Images
gulp.task('images', function() {
return gulp.src('_img/**')
.pipe(plumber())
.pipe(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))
.pipe(gulp.dest('resources/img'))
.pipe(notify({ message: 'Images task complete' }));
});
//Clean everything
gulp.task('rimraf', function() {
return gulp.src(['resources/css', 'resources/js', 'resources/img'], {read: false})
.pipe(rimraf());
});
gulp.task('watch', function() {
// Watch .scss files
gulp.watch('_scss/*.scss', ['styles']);
// Watch .js files
gulp.watch('_coffeescript/*.js', ['pluginsjs','mainjs']);
// Watch image files
gulp.watch('_img/**', ['images']);
//Create LiveReload server
var server = livereload();
//Watch any files in dist/, reload on change
gulp.watch(['dist + /**']).on('change', function(file) {
server.changed(file.path);
});
});
gulp.task('default', ['rimraf'], function() {
gulp.start(['styles', 'pluginsjs', 'mainjs', 'images', 'watch']);
});
But I deactive imagemin or anything that could be affectig , and is the same always... :(
What could it be?
thanks

Answer 1

It looks like you have another image that is overriding the Susy background. Try using the overlay option:
body
{
#include container(show overlay);
}